FailX
Tutti gli strumenti

Generatore di favicon

Crea una favicon da lettere, un’emoji o un’immagine. Ottieni favicon.ico, le icone Apple e Android, il manifest e i tag HTML.

Forma

Anteprima

Il mio sito

Mostrata a grandezza reale: 16, 32, 48 e 180 px. Controlla che resti leggibile a 16 px.

Lo ZIP contiene: favicon.ico (16, 32, 48), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180), android-chrome-192x192.png, android-chrome-512x512.png, site.webmanifest, favicon-tags.html

Tag per il <head> del tuo HTML

<link rel="icon" href="/favicon.ico" sizes="48x48">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

Metti i file nella radice del sito (es. https://tuo-dominio/favicon.ico), poi aggiungi questi tag nel <head> di ogni pagina.

Tutto viene elaborato nel tuo browser. Nulla viene inviato ai nostri server.

Guida

In breve

  • Crea un pacchetto completo di favicon per browser, iPhone e Android da un testo, un’emoji o un’immagine.
  • Carica i file nella radice del sito e incolla i tag HTML nel <head>.
  • Una o due lettere o un simbolo semplice restano leggibili a 16 px.

Che cos’è una favicon?

La piccola icona mostrata nelle schede, nei preferiti, nei risultati di ricerca e nella schermata Home dei telefoni. Google la mostra accanto al nome del tuo sito nei risultati — senza favicon compare un globo generico.

I file del pacchetto

  • favicon.ico (16, 32, 48 px) — schede, browser datati, risultati di ricerca
  • favicon-16x16.png, favicon-32x32.png — schede e preferiti dei browser recenti
  • apple-touch-icon.png (180 px) — «Aggiungi alla schermata Home» su iPhone e iPad
  • android-chrome-192x192.png, 512x512.png — schermata Home di Android e web app installabili
  • site.webmanifest — icona, nome e colore del tema per Android

Aggiungerla al tuo sito

  1. Estrai lo ZIP e carica tutti i file nella radice del sito.
  2. Incolla i tag di favicon-tags.html nel <head> di ogni pagina.
  3. Su WordPress, carica il PNG da 512 px in Aspetto → Personalizza → Identità del sito → Icona del sito.
  4. I browser tengono le favicon in cache a lungo — fai un ricaricamento forzato (Ctrl+F5) o apri una finestra in incognito.

Consigli per una favicon leggibile

  • A 16 px si leggono meglio una o due lettere o un simbolo semplice; un logo completo diventa sfocato.
  • Punta su un contrasto forte e controlla l’anteprima su schede chiare e scure.
  • Con lo sfondo trasparente, l’icona Apple viene riempita di bianco, perché iOS mostra la trasparenza come nero.

Domande frequenti

Non basta favicon.ico?

Copre le schede, ma i telefoni hanno bisogno di icone PNG più grandi quando il sito viene aggiunto alla schermata Home. Si consiglia il pacchetto completo.

Ho cambiato la favicon ma vedo ancora quella vecchia.

I browser tengono le favicon in cache. Prova un ricaricamento forzato (Ctrl+F5) o una finestra in incognito. I risultati di ricerca possono metterci qualche giorno ad aggiornarsi.

La mia immagine viene caricata?

No. Tutte le icone sono generate nel browser e non lasciano mai il tuo dispositivo.