Generatore di favicon
Trasforma un'immagine o una lettera nel set completo di file favicon, con l'HTML per usarli.
I tuoi file non lasciano mai il tuo dispositivo
Rilascia un'immagine qui
PNG, JPEG, WebP, GIF, BMP o AVIF. Oppure passa all'icona con lettere qui sotto.
Aperto su questo dispositivo. Non viene caricato nulla.
Un'immagine alla volta, fino a 50 MB e circa 100 megapixel. Le icone con lettere usano 1 o 2 caratteri.
Come creare una favicon
- Scegli un'immagine, oppure passa a Lettere e digita uno o due caratteri con i tuoi colori.
- Per un'immagine, scegli un ritaglio quadrato centrato oppure adatta con margini. Controlla le anteprime a 16, 32, 48 e 180 pixel.
- Premi Crea i file favicon, scarica lo .zip e incolla l'HTML nelle tue pagine.
Cosa contiene un set di favicon
Una favicon è la piccola icona nella scheda di un browser, nell'elenco dei segnalibri o in un risultato di ricerca. I browser cercano alcuni file diversi: favicon.ico per usi più vecchi e generici, icone PNG da 16 e 32 pixel per le schede, una Apple touch icon da 180 pixel per le schermate home di iPhone e iPad, e icone da 192 e 512 pixel per Android e le app web installabili. Un piccolo file site.webmanifest elenca le icone Android.
Questo strumento disegna ogni dimensione separatamente a partire dall'originale, così le dimensioni piccole sono ridotte dall'immagine intera anziché ingrandite da una minuscola. Il file .ico viene scritto come contenitore di tre immagini PNG a 16, 32 e 48 pixel. Le icone con lettere sono disegnate direttamente a ogni dimensione, così i contorni restano nitidi.
Suggerimenti
- Usa forme semplici e marcate e un forte contrasto. I dettagli fini scompaiono a 16 pixel.
- Vuoi un'immagine quadrata da una parte di una foto? Usa prima Ritaglia immagine con 1:1.
- Ti servono altre dimensioni? Ridimensiona immagine ti dà qualsiasi larghezza e altezza.
Domande frequenti
La mia immagine viene caricata?
No. Le icone vengono disegnate nel tuo browser, sul tuo dispositivo, e anche lo zip viene creato lì. Non viene inviato nulla a un server.
Quali file ottengo?
favicon.ico (versioni da 16, 32 e 48 pixel), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180 pixel), android-chrome-192x192.png, android-chrome-512x512.png e site.webmanifest, in un unico .zip.
Dove metto i file?
Nella cartella radice del tuo sito web, così vengono serviti a indirizzi come /favicon.ico. Poi incolla nell'head delle tue pagine il frammento HTML mostrato dopo aver creato i file.
Da quale immagine devo partire?
Un'immagine quadrata di almeno 512 × 512 pixel dà il risultato più pulito, perché l'icona più grande è di 512 pixel. Le forme semplici sopravvivono molto meglio di quelle dettagliate alla riduzione a 16 pixel. Controlla le anteprime a 16 e 32 pixel.
Qual è la differenza tra ritaglio e margini?
Il ritaglio prende un quadrato centrato dall'immagine e scarta il resto. Adatta con margini mantiene l'intera immagine, la centra con un piccolo margine e riempie lo spazio con il colore di sfondo oppure lo lascia trasparente.
Il file .ico è valido?
Sì. Contiene tre immagini codificate in PNG a 16, 32 e 48 pixel, che ogni browser attuale legge.