Generatore di favicon — favicon.ico e set di icone app

Crea le icone in tutte le dimensioni necessarie per la scheda del browser, la schermata Home del telefono e i risultati di ricerca, e scaricale in un unico file ZIP.

Il file non viene inviato al server — elaborazione solo nel browser di questo dispositivo

Testo o emoji (1-2 caratteri) Colore del testo

Spessore

Forma

Riempimento dello sfondo Colore di sfondo

Margine interno 12%

Informazioni app (site.webmanifest)

Nome del sito Nome breve (sotto l'icona nella schermata Home, massimo 12 caratteri) Colore del tema (colore della barra degli indirizzi su mobile)

Il mio sito

Nuova scheda

180 · iPhone

192 · Android

512

HTML da incollare dentro <head>

<link rel="icon" href="/favicon.ico" sizes="32x32">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<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">
<meta name="theme-color" content="#3182f6">

Il riferimento è valido quando i file nello ZIP vengono caricati nella cartella principale (/) del sito. Lo stesso codice si trova anche in head.html.

Come usare Crea favicon

1Carica un'immagine oppure imposta testo/emoji e colore.
2Usa l'anteprima per verificare l'aspetto alle diverse dimensioni.
3Premi [Scarica ZIP] e incolla il codice HTML indicato dentro <head>.

Domande frequenti

Che tipo di immagine originale dà i risultati migliori?

Un PNG o SVG quadrato di almeno 512×512 dà i risultati migliori. Alle dimensioni più piccole, le forme semplici si distinguono meglio.

Non basta un solo favicon.ico?

È sufficiente per i browser meno recenti, ma per la schermata Home di iPhone (180px) e Android (192/512px) serve un PNG separato.