Generatore di icone PWA

Genera le icone di cui una web app installabile ha bisogno — PNG da 192 e 512px più un site.webmanifest — da un'unica immagine, interamente nel tuo browser.

La privacy prima di tutto: ogni immagine viene elaborata localmente nel tuo browser. Nulla viene caricato, memorizzato o trasmesso ad alcun server.

Le icone che rendono un'app installabile

Una progressive web app viene giudicata installabile in parte dalle sue icone: i browser cercano un web manifest che dichiari almeno un PNG da 192×192 e uno da 512×512 prima di proporre l'installazione o mettere un'icona decente sulla schermata Home. Questo generatore crea entrambi dalla tua immagine sorgente e scrive un site.webmanifest che li richiama, insieme all'apple-touch-icon che iOS vuole e a una favicon.ico per le normali schede.

Dagli la forma giusta per il launcher

I launcher Android possono mascherare un'icona in un cerchio o in un quadrato arrotondato, quindi una grafica che arriva fino al bordo rischia di essere tagliata. Aggiungi qui spaziatura e uno sfondo pieno e la parte importante resta dentro l'area sicura qualunque maschera venga applicata; l'anteprima in tempo reale mostra il risultato a ogni dimensione. Tutto viene generato sul tuo dispositivo con la Canvas API — il tuo logo non viene mai caricato — e l'intero set si scarica come zip.

Domande frequenti

La mia immagine viene caricata per creare la favicon?
No. La favicon.ico, le icone PNG e il manifest sono tutti generati localmente nel tuo browser usando la Canvas API. La tua immagine non lascia mai il tuo dispositivo.
Quali dimensioni e file ottengo?
Una favicon.ico multi-risoluzione (16, 32 e 48px), icone PNG a 16, 32, 48, 180 (apple-touch-icon), 192 e 512px, un site.webmanifest e uno snippet HTML da incollare nel tuo <head>.
Posso convertire un PNG o SVG in ICO?
Sì. Trascina un PNG, JPG, SVG o WebP e scarica una vera favicon.ico. I loghi SVG vengono prima rasterizzati localmente ad alta risoluzione.
Quale immagine funziona meglio?
Un'immagine quadrata con un logo semplice e ad alto contrasto. Le immagini non quadrate vengono ritagliate al centro per adattarsi; usa i controlli di padding e forma per inquadrarla come preferisci.
Come installo la favicon?
Estrai il pacchetto nella cartella radice del tuo sito e incolla lo snippet HTML fornito nel <head> delle tue pagine. La favicon.ico viene rilevata automaticamente dalla maggior parte dei browser.