Generator de favicon
Browserele se așteaptă la mai multe dimensiuni de pictogramă: clasic 16×16 favicon.ico, 32×32 pictograme filă, 180×180 pictogramă Apple-touch și 192×192 pictograme PWA. Încărcați o siglă pătrată și descarcă un set complet - generat local fără a trimite activele mărcii tău la un server.
Cum se generează favicon-uri
1. Încărcați un PNG sau JPG pătrat (se recomandă 512×512 sau mai mare).
2. Previzualizează dimensiunile generate.
3. Descarcă pachetul de pictograme sau fișierele individuale.
4. Adăugați etichete de link la capul HTML și plasați fișierele în /public sau rădăcină site-ului.
Exemple de configurare a faviconului
Site static nou
Generați favicon.ico plus PNG 32×32 și adăugați etichete standard de link rel="icon" la layout.html.
Manifest PWA
Exportați 192×192 și 512×512 PNG pentru matricea de pictograme manifest.json.
Schimb de rebrand
Înlocuiți un logo principal și regenerați toate dimensiunile, astfel încât filele și comenzile rapide de pe ecranul de pornire să se potrivească.
Când să folosești un generator de favicon
• Când lansați un site și ai nevoie de toate dimensiunile standard de pictograme simultan.
• Când ai o siglă raster, dar nu un fișier .ico cu mai multe dimensiuni.
• Când vrei generare locală fără a încărca active de marcă.
Când să creați manual icoane
• Când logo-ul tău este detaliat - simplificați la o literă pentru lizibilitate 16×16.
• Când faviconurile SVG sunt suficiente pentru publicul modern.
• Când magazinele pe platformă necesită surse PSD stratificate strict specificate.
Lista de verificare a etichetelor de link HTML
Includeți rel="icon" pentru dimensiunile PNG, rel="apple-touch-icon" pentru iOS și, opțional, manifest.json pentru PWA. Plasați fișierele pe căi previzibile (/favicon.ico ajută în continuare crawlerele vechi).
Design pentru 16×16
Detaliile fine dispar la dimensiunea favicon. Folosește forme îndrăznețe, contrast ridicat și evitați liniile subțiri. Multe mărci folosesc variante monograme pentru dimensiuni mici.
Rupere cache la rebrand
Browserele memorează în cache favicon-urile în mod agresiv. Redenumiți fișierele sau adăugați interogarea ?v=2 atunci când actualizați pictogramele, astfel încât utilizatorii să vadă noul marcaj.
Întrebări frecvente
Ce dimensiune ar trebui să aibă imaginea sursă?
Cel puțin 512×512 px pătrat. Maeștrii mai mari reduc la scară mai bine decât creșterea siglelor mici.
Favicon ICO vs PNG?
Browserele moderne acceptă PNG; .ico include mai multe dimensiuni pentru filele Windows vechi.
dimensiunea pictogramei Apple Touch?
180×180 px pentru comenzile rapide de pe ecranul de pornire iOS — folosești PNG fără transparență pentru cele mai bune rezultate.
Fundal transparent?
Funcționează pentru file PNG; Pictogramele de acasă iOS pot obține o culoare albă mat - testați pe dispozitiv.
Sunt siglele încărcate pe un server?
Nu — redimensionarea folosește pânza local.
Sursa SVG?
Convertiți mai întâi SVG în PNG la rezoluție înaltă, apoi generați favicon-uri.