Guida

Favicon (.ico) vs PNG

ICO e PNG non sono in competizione — sono complementari. Il setup favicon moderno usa .ico come fallback universale e PNG come override per gli schermi HiDPI. Ecco quando conviene ciascuno.

Check favicons on any website

Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.

Install Chrome Extension

ICO è unico perché un singolo file incorpora più risoluzioni. Il browser o il sistema operativo sceglie la più adatta al momento del rendering — nessun upscaling, nessun bordo sfocato.

PNG offre una resa più nitida a qualsiasi singola risoluzione e una migliore compressione per loghi a tinta piatta. Non può però incorporare più dimensioni in un solo file.

Il setup ottimale: un .ico multi-risoluzione più PNG standalone 32×32 e 180×180 per browser HiDPI e iOS.

Come funziona

  1. 1

    Parti da un sorgente 512×512

    PNG o SVG.

  2. 2

    Genera entrambi i formati

    FetchFavicon produce un .ico multi-risoluzione più PNG standalone 16/32/48/180/192/512.

  3. 3

    Collegali entrambi nel <head>

    <link rel="icon" href="/favicon.ico"> seguito da <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">.

Provalo ora

Genera sia .ico che PNG

Convertitore PNG in ICO

FAQ

Quale pesa meno?+

Un singolo PNG è più leggero di un .ico alla stessa risoluzione, ma un .ico multi-risoluzione sostituisce 4-6 PNG e di solito vince in byte totali.

Google mostra le favicon PNG nei risultati di ricerca?+

Sì. Google supporta sia .ico che PNG. Preferisce un rapporto d'aspetto quadrato di almeno 48×48.

PNG supporta la dark mode?+

Non direttamente. Usa una variante SVG accanto al PNG per il supporto dark mode.

Strumenti correlati

Altre guide

Guide