Design

Gerador de Favicon

Carregue uma imagem PNG, JPG, SVG ou WebP e gere favicons em todos os tamanhos padrão (16×16 a 512×512). Processamento totalmente local — sua imagem nunca é enviada ao servidor.

[[ labels.upload_title ]]

[[ labels.upload_hint ]]

[[ labels.upload_formats ]]

[[ labels.drop_active ]]
preview
[[ imageFile?.name ]]

[[ labels.result_title ]]

[[ g.def.size ]]×[[ g.def.size ]]
[[ sizeLabel(g.def) ]]
[[ g.def.filename ]]

[[ labels.html_title ]]

[[ labels.html_desc ]]

[[ htmlSnippet ]]

Dicas

  • A imagem carregada nunca é enviada a nenhum servidor. Todo o processamento ocorre diretamente no seu navegador.
  • Imagem recomendada: Use um PNG quadrado (mínimo 512×512 px) para obter uma redução de tamanho nítida em todos os formatos. Transparência (canal alfa) é totalmente suportada.
  • Favicons SVG podem ser usados diretamente como <link rel="icon" type="image/svg+xml"> em alguns navegadores modernos. Porém, o iOS Safari exige um Apple Touch Icon no formato PNG.
  • Se você está desenvolvendo um PWA (Progressive Web App), registre os ícones PNG de 192×192 e 512×512 no seu manifest.json.

Perguntas frequentes

Esta ferramenta gera arquivos em formato PNG. Todos os navegadores modernos (Chrome, Firefox, Edge, Safari) suportam favicons PNG, portanto o formato ICO não é necessário na prática. O ICO só é exigido para compatibilidade com IE11 ou versões anteriores, o que é uma necessidade extremamente rara hoje em dia.

Recomendamos fornecer no mínimo 32×32 (aba do navegador) e 180×180 (Apple Touch Icon / tela inicial do iOS). Se você está criando um PWA, também precisa de 192×192 e 512×512.

A versão atual redimensiona a imagem para caber em uma tela quadrada preservando a proporção. Se a imagem contiver um logotipo ou texto, recomendamos recortá-la em formato quadrado antes do upload para obter o melhor resultado.

Curiosidade — A história do favicon — Uma pequena revolução de 16px

Em 1999, o Internet Explorer 5 foi o primeiro navegador a exibir pequenos ícones ao lado dos favoritos. Isso criou a convenção de colocar um arquivo chamado favicon.ico na raiz do site. A palavra "favicon" é uma abreviação de "favorite icon".

O formato ICO foi adaptado dos arquivos de ícones do Windows e podia conter múltiplos tamanhos (16×16, 32×32, 48×48) em um único arquivo. Hoje, PNG e SVG são alternativas viáveis. Os favicons SVG (image/svg+xml) se destacam por serem independentes de resolução e compatíveis com o modo escuro. A tag <link rel="icon"> foi formalmente padronizada em meados dos anos 2000, mas colocar favicon.ico na raiz persiste como convenção de compatibilidade retroativa.

Quando a Apple lançou o iPhone em 2007, introduziu sua própria especificação de Apple Touch Icon (apple-touch-icon.png) — o ícone exibido quando um usuário adiciona um atalho à tela inicial do iOS. Originalmente era 57×57 px, mas cresceu para o padrão atual de 180×180 px com a popularização das telas Retina. O crescimento dos PWAs adicionou 192×192 e 512×512 à lista, tornando o gerenciamento de favicons cada vez mais complexo ao longo dos anos.

Mais ferramentas nesta categoria