FailX
Todas as ferramentas

Gerador de favicon

Crie um favicon a partir de letras, um emoji ou uma imagem. Baixe de uma vez favicon.ico, ícones para Apple e Android, o manifesto web e as tags HTML.

Formato

Pré-visualização

Meu site

Exibido em tamanho real: 16, 32, 48 e 180 px. Confira se ainda dá para ler em 16 px.

O ZIP contém: favicon.ico (16, 32, 48), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180), android-chrome-192x192.png, android-chrome-512x512.png, site.webmanifest, favicon-tags.html

Tags para o <head> do seu HTML

<link rel="icon" href="/favicon.ico" sizes="48x48">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

Envie os arquivos para a raiz do seu site (ex.: https://seu-dominio/favicon.ico) e adicione estas tags ao <head> de todas as páginas.

Tudo é processado no seu navegador. Nada é enviado aos nossos servidores.

Guia

Pontos principais

  • Cria um pacote completo de favicons para navegadores, iPhone e Android a partir de texto, um emoji ou uma imagem.
  • Envie os arquivos para a raiz do site e cole as tags HTML no <head>.
  • Uma ou duas letras ou um símbolo simples continuam legíveis em 16 px.

O que é um favicon?

É o pequeno ícone que aparece nas abas do navegador, nos favoritos, nos resultados de busca e na tela inicial do celular. O Google o mostra ao lado do nome do seu site nos resultados — sem um, aparece um globo genérico.

Arquivos do pacote

  • favicon.ico (16, 32, 48 px) — abas do navegador, navegadores antigos, resultados de busca
  • favicon-16x16.png, favicon-32x32.png — abas e favoritos em navegadores modernos
  • apple-touch-icon.png (180 px) — “Adicionar à Tela de Início” no iPhone e iPad
  • android-chrome-192x192.png, 512x512.png — tela inicial do Android e apps web instaláveis
  • site.webmanifest — ícone, nome e cor do tema para Android

Como colocar no seu site

  1. Descompacte e envie todos os arquivos para a pasta raiz do seu site.
  2. Cole as tags de favicon-tags.html no <head> de todas as páginas.
  3. No WordPress, envie o PNG de 512 px em Aparência → Personalizar → Identidade do site → Ícone do site.
  4. Os navegadores guardam favicons em cache por muito tempo — use uma atualização forçada (Ctrl+F5) ou uma janela anônima para conferir.

Dicas para um favicon nítido

  • Em 16 px, uma ou duas letras ou um símbolo simples ficam mais legíveis; um logotipo completo tende a borrar.
  • Use contraste forte e confira a pré-visualização em abas claras e escuras.
  • Com fundo transparente, o ícone da Apple é preenchido de branco, porque o iOS mostra a transparência como preto.

Perguntas frequentes

Só o favicon.ico não basta?

Ele cobre as abas do navegador, mas celulares precisam de ícones PNG maiores quando alguém adiciona seu site à tela inicial. O recomendado é usar o pacote completo.

Troquei o favicon, mas continuo vendo o antigo.

Os navegadores guardam favicons em cache de forma agressiva. Tente uma atualização forçada (Ctrl+F5) ou uma janela anônima. Os resultados de busca podem levar alguns dias para atualizar.

Minha imagem é enviada?

Não. Todos os ícones são gerados no seu navegador e nunca saem do seu aparelho.