Immagini · Crea favicon

Generare favicon per un sito web su Mac

Tutte le favicon di cui un sito ha bisogno, più il web manifest e l'HTML da incollare nella pagina.

Funziona sul tuo Mac

Chiedi all'IAChatGPTClaudePerplexityModalità IAGrokMarkdown

Scarica OneMacTools Altri strumenti Immagini

Crea favicon su un Mac

Crea favicon con file di esempio e le sue opzioni

Cosa ha prodotto Crea favicon dai file di esempio

Screenshot dell'app, realizzati con file di esempio.

Come usare Crea favicon

1
Trascina il tuo logo
Usa un'immagine, possibilmente quadrata e di almeno 512 px. Le immagini non quadrate vengono ritagliate in un quadrato centrato.
2
Aggiungi i dati del tuo sito
Scrivi il nome del sito e il colore del tema per il web manifest, e scegli lo sfondo dell'icona Apple touch.
3
Fai clic su Crea favicon
Vengono creati tutti i file favicon, insieme al manifest e allo snippet HTML.
4
Caricalo sul tuo sito
Copia i file della cartella “favicons” (in una cartella con la data in Download › OneMacTools) nella radice del tuo sito web, e incolla l'HTML nell'<head> della pagina. Il codice viene mostrato anche nell'app.

Cosa fa Crea favicon

Da un solo logo ottieni favicon.ico con le versioni da 16, 32 e 48 px, PNG da 16 e 32 px, un'icona Apple touch da 180 px su sfondo pieno così non diventa nera su iPhone, e icone da 192 e 512 px per Android e le web app installabili, più un site.webmanifest con il nome del sito e il colore del tema e lo snippet HTML per il tuo <head>.

Ideale per

Aggiungere una favicon a un nuovo sito web
Rendi un sito installabile sui telefoni
Sostituire una favicon sfocata

Le opzioni spiegate

Nome del sito: Il nome usato in site.webmanifest, mostrato quando qualcuno installa il tuo sito su un telefono. Se lo lasci vuoto, viene usato il nome del file dell'immagine. Il nome breve è formato dai primi 12 caratteri.
Colore tema: Un colore esadecimale come #1E90FF, usato per il colore del tema del browser e per il colore di sfondo del manifest. Bianco se lasci vuoto.
Sfondo icona Apple touch: Bianco, Colore tema o Nero. Gli iPhone mostrano le icone trasparenti della schermata Home su nero, quindi l'icona Apple touch da 180 px riceve uno sfondo pieno.
Arrotonda gli angoli: Disattivato per impostazione predefinita. Arrotonda gli angoli del tuo logo in tutte le dimensioni della favicon.

Consigli pratici

Usa un simbolo semplice, non il logo completo con le scritte. A 16 px restano riconoscibili solo le forme marcate.
Parti da un PNG trasparente, così la favicon sta bene sia sulle schede chiare sia su quelle scure del browser.
Scrivi il colore del tema come valore esadecimale. Colora l'interfaccia del browser su alcuni telefoni, quindi scegli il colore principale del tuo brand.
Dopo il caricamento, apri il sito in una finestra privata per controllare la nuova icona, perché i browser tengono a lungo le favicon nella cache.

Funziona con

In: Un'immagine, idealmente un PNG quadrato da 512 px o più.
Esce: Una cartella “favicons” con favicon.ico (16, 32 e 48 px al suo interno), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180 px), android-chrome-192x192.png e android-chrome-512x512.png, più site.webmanifest e add-to-head.html.

Le immagini non quadrate vengono ritagliate in un quadrato centrato.

Domande su Crea favicon

Di quali file favicon ha bisogno un sito web?

favicon.ico per i browser meno recenti, PNG da 16 e 32 px per le schede, un'icona Apple touch da 180 px per la schermata Home dell'iPhone, e icone da 192 e 512 px con un web manifest per Android. OneMacTools le crea tutte, insieme all'HTML da incollare nell'<head> della tua pagina.

Dove finiscono i file?

Nella cartella principale del tuo sito web, accanto a index.html. Sia lo snippet HTML sia il manifest si aspettano di trovarli lì.

Come faccio a creare un favicon.ico su Mac?

Trascina il tuo logo su Crea favicon e fai clic su Crea favicon. Viene creato favicon.ico con le versioni da 16, 32 e 48 px al suo interno, insieme alle dimensioni PNG.

Perché la mia icona appare nera nella schermata Home di un iPhone?

iOS mostra in nero le aree trasparenti di un'icona della schermata Home. Per evitarlo, l'icona Apple touch viene posizionata su uno sfondo pieno bianco, nero o del colore del tema.

A cosa serve site.webmanifest?

Comunica ai telefoni nome, icone e colori del tuo sito quando qualcuno lo aggiunge alla schermata Home o lo installa come web app.

La mia nuova favicon non compare. Cosa c'è che non va?

I browser tengono le favicon nella cache in modo molto aggressivo. Controlla che i file siano nella radice del sito e il codice nell'<head>, poi ricarica in una finestra privata.

Crea favicon carica i miei file?

No. Crea favicon funziona interamente sul tuo Mac, quindi i tuoi file non lo lasciano mai e funziona anche offline.

Crea favicon modificherà i miei file originali?

No. I risultati vengono salvati come nuovi file in una cartella datata in Download › OneMacTools, e gli originali restano esattamente com'erano, a meno che tu non attivi un'opzione che dice il contrario.

Cosa serve a Crea favicon?

Basta un Mac con macOS 26 o versioni successive. Non c'è nient'altro da installare.