Generatore di favicon
Browsers expect multiple icon sizes: classic 16×16 favicon.ico, 32×32 tab icons, 180×180 apple-touch-icon, and 192×192 PWA icons. Upload a square logo and download a complete set — generated locally without sending your brand assets to a server.
How to generate favicons
1. Upload a square PNG or JPG (512×512 or larger recommended).
2. Preview generated sizes.
3. Download the icon pack or individual files.
4. Add link tags to your HTML head and place files in /public or site root.
Esempi di configurazione delle favicon
Nuovo sito statico
Genera favicon.ico più 32×32 PNG e aggiungi i tag link standard rel="icon" a layout.html.
Manifesto PWA
Esporta 192×192 e 512×512 PNG per l'array di icone manifest.json.
Scambio di rebranding
Sostituisci un logo principale e rigenera tutte le dimensioni in modo che le schede e le scorciatoie della schermata iniziale corrispondano.
Quando usa un generatore di favicon
• Quando si avvia un sito e sono necessarie tutte le dimensioni standard delle icone contemporaneamente.
• Quando hai un logo raster ma non un file .ico di più dimensioni.
• Quando desideri la generazione locale senza caricare risorse del marchio.
Quando realizzare icone a mano
• Quando il tuo logo è dettagliato, semplificalo in un segno di lettera per una leggibilità 16×16.
• Quando le favicon SVG sono sufficienti per un pubblico esclusivamente moderno.
• Quando i negozi su piattaforma richiedono fonti PSD a strati rigorosamente specificate.
Elenco di controllo dei tag di collegamento HTML
Includi rel="icon" per le dimensioni PNG, rel="apple-touch-icon" per iOS e facoltativamente manifest.json per PWA. Posiziona i file in percorsi prevedibili (/favicon.ico aiuta ancora i vecchi crawler).
Design per 16×16
I dettagli fini svaniscono alle dimensioni della favicon. Utilizza forme audaci, contrasto elevato ed evita tratti sottili. Molti marchi utilizzano varianti di monogrammi per taglie minuscole.
Busting della cache durante il rebranding
I browser memorizzano nella cache le favicon in modo aggressivo. Rinomina i file o aggiungi la query ?v=2 durante l'aggiornamento delle icone in modo che gli utenti vedano il nuovo segno.
Domande frequenti
Che dimensioni dovrebbe avere l'immagine sorgente?
Almeno 512×512 px quadrati. I master più grandi eseguono il downscaling meglio dell'upscaling dei loghi piccoli.
ICO o favicon PNG?
I browser moderni accettano PNG; .ico raggruppa più dimensioni per le schede Windows legacy.
dimensione dell'icona Apple Touch?
180×180 px per le scorciatoie della schermata iniziale di iOS: utilizza PNG senza trasparenza per ottenere i migliori risultati.
Sfondo trasparente?
Funziona con le schede PNG; Le icone Home di iOS potrebbero avere un colore bianco opaco: prova sul dispositivo.
I loghi vengono caricati su un server?
No: il ridimensionamento utilizza la tela localmente.
SVG fonte?
Converti prima SVG in PNG ad alta risoluzione, quindi genera favicon.