Gerador de favicon – ICO, PNG e manifest
Escolha o seu logo; todos os ícones de que a aba do navegador, a tela inicial do celular e o Android precisam, mais o site.webmanifest, ficam prontos num único ZIP. A sua imagem nunca sai do seu dispositivo.
- PNG→ vira ICO
- Até 10 MB
- Sem cadastro
- Roda no seu dispositivo
36 Gerador de favicon
- 01 Escolha
- 02 Processe
- 03 Baixe
Processado no seu dispositivo · sem envio
Você abriu esta página dentro de um app. Para baixar sem problemas, use o menu ••• e escolha Abrir no navegador.
Status ao vivo
Lendo o arquivo
Resultado
Pronto.
0arquivo(s) no ZIP
0 BDados enviados ao nosso servidor: 0 bytes · processado no seu dispositivoPor que 0: a regra de segurança desta página bloqueia o envio de dados no nível do navegador; tudo acontece nesta aba. CSP · connect-src 'none' · form-action 'none'
Não foi possível converter.
Detalhes muito finos podem sumir em 16 pixels; uma marca simples fica mais legível em tamanhos pequenos.
- O trabalho é feito nesta aba, no seu dispositivo.
- ICO, PNGs, manifest e as linhas de HTML vêm em um só ZIP.
- Nenhum arquivo é enviado ao nosso servidor; fechar a aba apaga tudo.
Escolha um logo primeiro
Etapas
- Lendo o arquivo
- Desenhando os ícones
- Preparando o arquivo
- Seu arquivo fica no seu dispositivo
- Nada é enviado ao nosso servidor
- Grátis, sem cadastro
01
De quais arquivos de favicon um site precisa?
O favicon é o pequeno ícone que aparece ao lado do nome do site na aba do navegador, nos favoritos e nos resultados de busca. Um único arquivo não basta: navegadores antigos e novos procuram o favicon.ico, iPhones e iPads procuram um apple-touch-icon de 180 pixels quando o site é adicionado à tela inicial, e o Android e os apps da web instaláveis querem ícones de 192 e 512 pixels, mais um arquivo site.webmanifest.
Os tamanhos pequenos são os mais difíceis: um logo reduzido a 16 pixels pode ficar borrado ou perder detalhes finos. Na tela inicial do iPhone, as áreas transparentes aparecem pretas, então o apple-touch-icon precisa de um fundo sólido.
Esta ferramenta desenha o seu logo (PNG, SVG, JPG ou WEBP) uma vez em 1024 pixels e o reduz pela metade, passo a passo, até cada tamanho, para que os ícones pequenos fiquem nítidos. Você pode escolher uma cor de fundo, a margem e o formato quadrado, arredondado ou circular, e ver o resultado numa prévia da aba do navegador e da tela inicial do celular. O favicon.ico, os PNGs, o site.webmanifest e as linhas HTML para a sua página vêm num único ZIP. A imagem é processada no seu navegador.
02
Crie um conjunto de favicons em 3 passos
Escolha o seu logo: Selecione um arquivo PNG, SVG, JPG ou WEBP quadrado ou quase quadrado (até 10 MB). SVG ou PNG de pelo menos 512 pixels dão o melhor resultado.
Ajuste a aparência: Mantenha o fundo transparente ou escolha uma cor; ajuste a margem e o formato quadrado, arredondado ou circular. As prévias da aba, da tela inicial e do ícone grande se atualizam na hora.
Baixe o ZIP: “Gerar favicons” entrega todos os arquivos num único ZIP. Coloque os arquivos na pasta raiz do site e cole as linhas HTML no <head> da sua página.
03
Para quem é útil
Sites e blogs: Preparar o ícone que aparece nas abas e nos favoritos de um site novo.
Lojas virtuais: Deixar o logo da loja nos tamanhos certos para a aba do navegador, os resultados de busca e a tela inicial do celular.
Apps da web: Gerar os ícones de 192 e 512 pixels e o manifest de um app da web instalável (PWA).
Agências e designers: Entregar em minutos um conjunto completo de favicons a partir do logo de um cliente.
Desenvolvedores: Ter os arquivos e as linhas do <head> prontos para colocar num projeto.
Páginas pessoais: Adicionar um ícone com as suas iniciais a um portfólio ou site de currículo.
04
Tamanhos, qualidade e limites
Arquivos gerados: favicon.ico (16, 32 e 48 pixels), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180 pixels), android-chrome-192x192.png, android-chrome-512x512.png, site.webmanifest e as linhas HTML. Se você enviou um SVG, o favicon.svg também é incluído.
Nitidez: A imagem é desenhada primeiro em 1024 pixels e depois reduzida pela metade passo a passo; isso dá ícones pequenos mais nítidos do que um único salto grande. Linhas muito finas ainda podem sumir em 16 pixels; um símbolo simples fica mais legível nesse tamanho.
Transparência: PNG e ICO mantêm a transparência. O apple-touch-icon é sempre opaco para não ficar preto no iPhone: sem cor de fundo, é usado o branco.
Imagem de origem: Imagens que não são quadradas são centralizadas sem corte. Com imagens menores que 256 pixels, os ícones grandes podem ficar borrados; a ferramenta avisa.
Formato ICO: As imagens dentro do ICO são guardadas como PNG, um formato que todos os navegadores atuais e o Windows desde o Vista leem.
Privacidade e limites: A imagem pode ter até 10 MB. O seu logo não é enviado nem armazenado; todos os arquivos são gerados no seu navegador.
05
Privacidade e exclusão automática
Esta ferramenta não envia seu arquivo ao nosso servidor: todo o processamento acontece no seu navegador, no seu dispositivo. A página é servida com uma política de segurança (Content-Security-Policy) que impede tecnicamente que o conteúdo do arquivo seja enviado a qualquer lugar; nenhum script de análise ou de publicidade roda nesta página.
O arquivo de resultado também é criado no seu dispositivo, e só você faz o download. Ele é apagado da memória do navegador quando você fecha a aba ou escolhe “Novo arquivo”. Nosso servidor não guarda nenhum registro de nome ou conteúdo de arquivo deste processamento.
06
Perguntas frequentes
Que tamanhos o favicon deve ter?
16 e 32 pixels para abas e favoritos (mais 48 dentro do favicon.ico), um apple-touch-icon de 180 pixels para a tela inicial do iPhone, e 192 e 512 pixels para o Android e os apps da web instaláveis. A ferramenta gera todos de uma vez.
Como coloco o favicon no meu site?
Envie os arquivos do ZIP para a pasta raiz do site (logo abaixo do domínio) e cole as linhas HTML da ferramenta no <head> da sua página. Em sistemas como o WordPress, basta enviar o PNG de 512 pixels como “Ícone do site”.
Posso criar um favicon a partir de um logo em SVG?
Sim, e o SVG dá o melhor resultado: cada tamanho é desenhado a partir do vetor. A ferramenta também inclui o favicon.svg, que os navegadores compatíveis mostram nítido em qualquer tela.
Por que o meu ícone fica com fundo preto no iPhone?
O iOS não aceita transparência nos ícones da tela inicial e mostra as áreas transparentes em preto. Por isso a ferramenta sempre gera o apple-touch-icon opaco, usando branco quando você não escolhe um fundo. Se quiser, escolha uma cor que combine com a sua marca.
Troquei o ícone, mas o navegador ainda mostra o antigo. Por quê?
Os navegadores guardam o favicon em cache por muito tempo. Force a atualização (Ctrl+F5, ou Cmd+Shift+R no Mac), abra a página numa janela anônima ou acrescente algo como ?v=2 ao nome do arquivo na linha HTML.
O meu logo é enviado a um servidor?
Não. A imagem é desenhada no seu navegador e todos os arquivos são gerados ali; a página vem com uma política de segurança que bloqueia tecnicamente conexões com o exterior. Você pode usá-la com segurança para uma marca que ainda não é pública.