ICO vs PNG para favicons

ICO é universal mas antigo; PNG é moderno mas exige link explícito. Veja como usar os dois juntos.

4 min de leitura

Check favicons on any website

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

Install Chrome Extension

ICO: o fallback universal

Todo navegador desktop busca /favicon.ico sem que você faça nada. É um contêiner capaz de embutir várias resoluções.

Atalhos do Windows e o Explorador de Arquivos dependem do .ico — mesmo que você não se preocupe com favicons na web, publique um para o sistema operacional.

PNG: qualidade perfeita em qualquer densidade

PNG renderiza com nitidez em telas de alta DPI quando vinculado com <link rel="icon" sizes="...">.

Use PNGs de 192×192 e 512×512 para o web manifest e 180×180 para o apple-touch-icon.

Veredicto: use ambos

Publique um .ico multirresolução para suporte universal, mais variantes PNG para telas HD e prompts de instalação PWA. Adicione SVG por cima para o ícone vetorial mais nítido.

Perguntas frequentes

Should I use ICO or PNG for a favicon?

Use both: ICO for universal /favicon.ico fallback and PNG for high-DPI tabs and PWA manifest icons.

Does every browser support PNG favicons?

Modern browsers do when you link them with <link rel="icon" type="image/png">. ICO remains the safest default.

Is ICO outdated?

ICO is older but still required for Windows shortcuts and automatic /favicon.ico discovery by browsers.

Guias relacionados

Experimente as ferramentas

Continuar lendo