Salta al contenuto principale

Configurazione

Anteprima

64x64 (anteprima)

Scarica per dimensione

16x16
favicon
32x32
favicon
48x48
favicon
192x192
icon
512x512
icon

Tag HTML da copiare

<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="192x192" href="/icon-192x192.png">
<link rel="icon" type="image/png" sizes="512x512" href="/icon-512x512.png">

Incolla questi tag nel <head> del tuo HTML dopo aver caricato i PNG sul server.

Come utilizzare Favicon Generator

Scegli la modalità: testo/iniziali oppure emoji

Nel pannello "Configurazione" seleziona la scheda "Testo / Iniziali" per generare un favicon con 1-3 caratteri, oppure "Emoji" per scegliere un'emoji da una griglia predefinita.

Personalizza colori e font

Imposta il colore di sfondo e, in modalità testo, il colore del testo e il font tra quelli disponibili (Arial, Georgia, Courier New, Impact, Trebuchet MS, Verdana). L'anteprima 64x64 si aggiorna in tempo reale.

Scarica i PNG nelle dimensioni standard

Nel pannello "Scarica per dimensione" scarica i file PNG generati nelle dimensioni 16x16, 32x32, 48x48 (favicon classiche) e 192x192, 512x512 (icone per PWA e touch icon).

Copia i tag HTML e caricali sul server

Copia lo snippet HTML pronto e incollalo nell'head della tua pagina, dopo aver caricato i file PNG scaricati con lo stesso nome referenziato nei tag (favicon-16x16.png, favicon-32x32.png, icon-192x192.png, icon-512x512.png).

Suggerimenti

  • Usa colori ad alto contrasto tra sfondo e testo: a 16x16 pixel le sfumature simili diventano illeggibili.
  • Per un brand riconoscibile, usa le iniziali del tuo sito o del progetto (es. "FC") invece di un'emoji generica.
  • Verifica sempre l'anteprima a dimensione reale nel browser dopo il deploy: alcuni browser mostrano il favicon con angoli o padding leggermente diversi.

Domande frequenti

Quali dimensioni di favicon vengono generate?

Il tool genera PNG in 5 dimensioni: 16x16 e 32x32 (favicon classiche per la barra degli indirizzi), 48x48 (Windows), 192x192 e 512x512 (icone per home screen mobile e Progressive Web App).

I miei dati o le immagini vengono inviati a un server?

No, tutta la generazione avviene nel browser tramite l'elemento canvas HTML5. Testo, emoji e colori scelti restano nel tuo dispositivo e i PNG vengono creati ed esportati localmente, senza upload.

Posso usare un logo o un'immagine al posto del testo?

Questa versione del tool supporta solo testo/iniziali (fino a 3 caratteri) o emoji come contenuto del favicon. Per un logo personalizzato, usa un editor immagini per ritagliare un quadrato e poi ridimensionalo manualmente nelle dimensioni indicate.

Perché il testo viene troncato a 3 caratteri?

Un favicon è molto piccolo (16x16 o 32x32 pixel): oltre 2-3 caratteri il testo diventa illeggibile. Per questo il campo testo è limitato a 3 caratteri e la dimensione del font si riduce automaticamente in base alla lunghezza inserita.

Come uso i file scaricati sul mio sito web?

Carica i PNG scaricati nella root del tuo sito (o in una cartella assets) mantenendo i nomi generati, poi incolla lo snippet HTML copiato dal tool nell'head della pagina: i browser e i dispositivi mobili sceglieranno automaticamente la dimensione più adatta.