# Generatore di favicon

https://rankproof.eu/it/tools/seo-favicon-generator

## Risposta breve

Crea favicon.ico, icone Apple touch e per web app, oltre ai tag HTML, da una sola immagine.

## Cosa fa

Crea un set di favicon da una sola immagine: favicon.ico con icone da 16, 32 e 48 px, un'icona Apple touch da 180 px, icone da 192 e 512 px per il manifest della web app, un'icona maskable da 512 px, e i tag HTML da aggiungere alle tue pagine. Un SVG caricato viene incluso anche come icon.svg.

## Come funziona

1. Scegli un'immagine quadrata, idealmente un SVG o un PNG di almeno 512×512 px
2. Scegli un colore di sfondo per l'icona Apple touch e per l'icona maskable
3. Il tuo browser disegna ogni dimensione e le raggruppa in favicon.ico
4. Scarica i file, copia i tag HTML e testa il risultato con il controllo favicon

## Esempio di input e output

INPUT

```text
immagine: logo.svg
sfondo: #ffffff
```

OUTPUT

```text
favicon.ico              16, 32, 48 px
apple-touch-icon.png     180 px
icon-192.png             192 px
icon-512.png             512 px
icon-512-maskable.png    512 px
icon.svg                 SVG originale
manifest.webmanifest     icone manifest

<link rel="icon" href="/favicon.ico" sizes="16x16 32x32 48x48">
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="icon" href="/icon-192.png" type="image/png" sizes="192x192">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/manifest.webmanifest">
```

## Perché è importante

I browser mostrano la favicon nelle schede e nei preferiti, i telefoni usano l'icona touch nella schermata home, e Google Search può mostrare la favicon accanto alle tue pagine nei risultati. Google la mostra solo quando l'icona è quadrata, di almeno 8×8 px (è consigliato oltre 48×48 px) ed è possibile eseguirne la scansione insieme alla home page.

## Chi lo usa

- **Titolare di piccola impresa**: Trasforma un logo in tutti i file di icone di cui un nuovo sito web ha bisogno.
- **Sviluppatore web**: Genera il set di icone e le icone del manifest per una progressive web app.
- **Designer**: Vedi come appare un logo a 16 px prima di consegnarlo.

## Domande frequenti

### Di quali file ho bisogno?

La maggior parte dei siti usa favicon.ico, un'icona Apple touch e icone da 192 e 512 px per il manifest della web app. Un'icona SVG è opzionale; i browser che la supportano possono usarla a qualsiasi dimensione.

### Perché il file ICO contiene immagini PNG?

Il formato ICO può contenere immagini PNG, e ogni browser attuale le legge. Il file contiene le versioni da 16, 32 e 48 px così ogni browser può scegliere la dimensione di cui ha bisogno.

### Cos'è un'icona maskable?

Un'icona con spazio extra intorno al logo, così Android può ritagliarla in un cerchio o un'altra forma. Lo strumento mantiene l'intera immagine dentro la zona di sicurezza, così nulla viene tagliato.

### Perché l'icona Apple touch e l'icona maskable ricevono un colore di sfondo?

iOS mostra le parti trasparenti dell'icona touch come nere, e un'icona maskable deve riempire l'intera forma, quindi entrambe ricevono il colore che scegli. Le altre icone mantengono la trasparenza.

### La mia immagine viene caricata?

No. Le icone vengono disegnate nel tuo browser, e l'immagine non lascia mai il tuo dispositivo.

## Strumenti correlati in Analisi SEO

- [Verificatore di title e meta description](https://rankproof.eu/it/tools/seo-meta-title)
- [Controllo tag di intestazione](https://rankproof.eu/it/tools/seo-heading-tags)
- [Verificatore Alt Text Immagini](https://rankproof.eu/it/tools/seo-image-alt)
- [Verificatore URL Canonical](https://rankproof.eu/it/tools/seo-canonical-url)
- [Analizzatore Robots.txt](https://rankproof.eu/it/tools/seo-robots-txt)
- [Generatore di Robots.txt](https://rankproof.eu/it/tools/seo-robots-txt-generator)
