Generatore di faviconTutte le dimensioni, e il blocco head che le accompagna.
Trascina un logo e ottieni un vero favicon.ico multi-risoluzione, le dimensioni PNG che i browser chiedono, un apple touch icon, l’icona maskable di Android e un site.webmanifest già compilato. Tutto viene generato in questa scheda, la tua immagine non viene mai caricata.
Trascina qui il tuo logo
Oppure tocca per scegliere un file. Un’immagine quadrata da 512 px o più dà il risultato migliore.
PNG, JPG, WebP, SVG, ICO o GIF
La tua immagine viene letta, ridimensionata e impacchettata dentro questa scheda. Non viene mai caricata, e non c’è nessun server coinvolto in nessun momento.
Quali dimensioni di favicon servono davvero nel 2026?
Molte meno dei pacchetti da venti file che la maggior parte dei generatori continua a consegnare. Cinque superfici coprono ogni browser e ogni sistema operativo che conta, e tutto il resto è peso nel tuo <head> senza alcun vantaggio.
favicon.ico, 16 e 32 e 48
È ancora il file che un browser cerca nella radice del tuo dominio prima di aver letto una sola riga di HTML. Un solo contenitore tiene tutte e tre le dimensioni, ed è per questo che questo convertitore di favicon costruisce un .ico vero invece di rinominare un PNG. 16 px è la scheda, 32 px è la scheda retina e la barra dei preferiti, 48 px sono i collegamenti di Windows.
favicon.svg, quando hai un vettoriale
Una favicon vettoriale resta nitida a qualsiasi dimensione e può perfino rispondere alla modalità scura del sistema con una media query dentro il file. I browser che la capiscono la preferiscono al .ico. Se qui carichi un SVG resta vettoriale, non viene mai rasterizzato e restituito come un falso.
apple-touch-icon.png, 180×180
L’icona che iOS usa quando qualcuno aggiunge il tuo sito alla schermata home. Un file basta: da iOS 8 il sistema riduce una sola icona da 180 px, quindi la vecchia pila da apple-touch-icon-57x57 fino a 152x152 è zavorra. Questo generatore di apple touch icon ne scrive una, e la rende opaca.
android-chrome 192 e 512, più la maskable
Vengono richiamate dal site.webmanifest e non da un tag link. 192 px è la schermata home, 512 px è la schermata di avvio e il prompt di installazione. La variante maskable è quella che Android ritaglia nella forma usata dal launcher, quindi il suo segno grafico ha bisogno di un margine vero.
mstile-150x150.png, costa poco tenerlo
I siti aggiunti alla barra di Windows lo leggono ancora. Costa un piccolo PNG e due meta tag, quindi è incluso, ma non si rompe nulla se lo cancelli. Questa è la risposta onesta, ed è il motivo per cui sta in fondo alla lista invece di essere presentato come indispensabile.
Perché un file .ico contiene più immagini?
Perché .ico è un formato contenitore, non un formato immagine. Capirlo fa la differenza tra una favicon che si vede ovunque e una che fallisce in silenzio su Windows e nei lettori di feed.
Prima una directory, poi le immagini
Il file si apre con un’intestazione di sei byte che dice quante immagini seguono, poi una voce da sedici byte per ciascuna con larghezza, altezza, lunghezza in byte e posizione nel file, e solo dopo i dati delle immagini. Tutto è little-endian. È quella struttura a rendere un PNG rinominato in .ico un non-.ico.
Chi legge sceglie la dimensione
Un browser che disegna una scheda da 16 px legge la directory, trova la voce da 16 px e decodifica solo quella. Dagli una sola immagine da 512 px e la ridurrà al momento del disegno, con un campionamento povero e un risultato sfocato. Dagli un 16 px fatto apposta e userà quello.
I dati possono essere PNG
Il formato originale incorporava BMP con l’ordine dei pixel rovesciato e una maschera di trasparenza a un bit separata. Tutti i browser e tutti i Windows da Vista in poi accettano anche il PNG dentro il contenitore, ed è quello che scrive questo convertitore ico: file più piccoli, alfa vero, nessun encoder legacy.
È a 16 px che si vede la qualità
Ridurre un logo da 1024 px direttamente a 16 px campiona troppi pochi pixel di partenza e produce una macchia grigia. Questo strumento dimezza l’immagine su canvas intermedi, da 1024 a 512 a 256 e così via, così ogni pixel contribuisce. È l’unico motivo per cui una favicon piccola resta leggibile.
Serve ancora un apple-touch-icon?
Sì, ed è l’unico file le cui regole sono diverse da tutte le altre icone del pacchetto. Due cose da sapere, entrambe già gestite qui sopra.
iOS butta via la tua trasparenza
Safari compone l’icona della schermata home su nero e non sullo sfondo, quindi un logo esportato con cura su fondo trasparente arriva come una forma sospesa su una tessera nera. Per questo lo strumento scrive sempre l’apple-touch-icon con sfondo opaco, bianco di default, anche se per tutto il resto hai scelto trasparente. Da iOS 7 il sistema non applica più nemmeno il suo effetto lucido, quindi quello che consegni è quello che la gente vede.
Android ritaglia, non aggiunge margine
Un launcher Android prende l’icona maskable e la taglia nella sua forma, cerchio, squircle o quadrato arrotondato a seconda del telefono. È garantito solo l’80 % centrale, quindi un logo che riempie la tela da bordo a bordo perde le estremità. Qui il file maskable tiene un margine del 20 % qualunque valore imposti sul cursore, e l’anteprima circolare mostra esattamente cosa resterà.
Come aggiungo una favicon al mio sito?
Due passaggi, ed è nel secondo che si concentrano gli errori. Copia il blocco generato dallo strumento invece di scriverlo a memoria.
Metti i file nella radice
Lascia favicon.ico e gli altri accanto al tuo index.html, così rispondono su tuosito.it/favicon.ico. I browser chiedono quel percorso esatto da soli, senza che glielo si dica, ed è per questo che la posizione conta più del tag link.
Incolla il blocco head su ogni pagina
Non solo sulla home. Chi atterra su una pagina interna e la salva nei preferiti deve ricevere l’icona giusta. Se il tuo sito usa un template o un framework, il blocco va nel layout condiviso.
Dichiara il .ico senza dimensione
Usa rel="icon" href="/favicon.ico" sizes="any". Le dimensioni sono già dentro il contenitore, e fissarne una nel markup impedisce al browser di andare a prendere le altre. La riga dell’SVG viene per prima, così i browser che capiscono il vettoriale scelgono quello.
Poi ricarica forzando, due volte
Le favicon vengono messe in cache in modo aggressivo e separatamente dalla pagina, quindi la vecchia icona può sopravvivere a un normale ricaricamento per giorni. Apri il file direttamente su tuosito.it/favicon.ico per confermare che venga servito quello nuovo, prima di concludere che qualcosa non funziona.
Vuoi verificare dove punta davvero un codice QR o un link breve che già esiste? Decodificalo con il resolver di codici QR
Ti serve un link breve per il sito appena messo online? Creane uno con l’accorciatore di link gratuito
L’icona è la metà piccola di una prima impressione.
Una favicon è quello che le persone vedono quando sono già sul tuo sito. Il lavoro più difficile lo fa il link che ce le ha portate, ed è di solito la parte che nessuno misura. Se la cosa ti interessa, LinkScale è ciò che costruiamo.
Guarda da dove è arrivata la visita
Clic, paesi, dispositivi e cosa è successo dopo, per ogni link che distribuisci, invece di un numero nella dashboard di qualcun altro.
Cambia la destinazione dopo
Porta altrove un link stampato o pubblicato anche a cose fatte, senza chiedere a nessuno di aggiornare quello che ha salvato.
Una pagina per tutto
Una pagina link in bio che tiene insieme lo shop, il modulo di prenotazione e i social, così l’unico link concesso rende di più.
Domande sul generatore di favicon
Hai altre domande?
OnlinePersone reali, di solito rispondono in pochi minuti.
È gratuito, senza account, senza filigrana e senza limiti sul numero di file che generi. La tua immagine non viene mai caricata: viene letta dal FileReader del browser, disegnata su un canvas e impacchettata in Blob, tutto dentro la pagina. Dietro questo strumento non c’è nessun endpoint, quindi non c’è nemmeno un posto dove mandarla. Puoi verificarlo aprendo la scheda di rete del browser mentre lo usi, oppure scollegandoti da internet dopo che la pagina si è caricata.
Vai oltre con LinkScale
Favicon fatta. Il link che porta le persone è l’altra metà.
LinkScale è una piattaforma di gestione dei link per chi vuole sapere cosa succede dopo il clic, e cambiare la destinazione senza ristampare nulla.
Free 14-day trial on every plan