Início / Design / Gerador de favicon e ícones de app
Ícones e marca

Gerador de favicon e ícones de app

Envie um logo, visualize ícones em vários tamanhos, baixe PNG e copie o snippet HTML para seu site ou PWA.

Nenhum arquivo escolhido
Use um PNG ou SVG quadrado com boa resolução (mínimo 512×512 recomendado).
Usado como preenchimento e como theme-color no snippet HTML sugerido.
Selecione quais tamanhos gerar. Clique em um ícone ou na etiqueta para baixar esse PNG.

Prévia dos ícones

Clique em qualquer ícone ou etiqueta para baixar esse tamanho em PNG. Salve os arquivos no seu projeto (ex.: /assets/icons).

Este gerador roda totalmente no seu navegador. Lembre-se de enviar os PNG baixados e ajustar os caminhos no snippet ao seu projeto.

Todo projeto sério precisa de um favicon claro nas abas do navegador, um ícone Apple touch para iOS e ícones de app para Android e PWA. Esta ferramenta ajuda a gerar tudo a partir de uma imagem: envie um logo quadrado, escolha os tamanhos, baixe os PNG e copie o snippet HTML para o seu site.

Por que favicon e ícones de app importam

  • Favicon — o ícone pequeno na aba do navegador e nos favoritos. Sem ele, a aba fica genérica e sua marca é menos reconhecida.
  • Ícone Apple touch — usado quando o usuário adiciona seu site à tela inicial no iPhone e iPad. O tamanho certo (ex.: 180×180) garante um ícone nítido.
  • Ícones PWA / Android — necessários para “Adicionar à tela inicial” e instalação. Tamanhos típicos: 192×192 e 512×512.

Uma única imagem quadrada pode atender a todos. O gerador roda inteiramente no navegador: seu logo não sai do seu dispositivo.

Imagem de origem recomendada

Use uma imagem quadrada (PNG ou SVG) com pelo menos 512×512 pixels. Resolução maior é ok; a ferramenta redimensiona. Evite imagens muito pequenas ou distorcidas para os ícones ficarem nítidos em telas de alta densidade.

Início rápido com a ferramenta

  1. Enviar — Clique em “Escolher arquivo” e selecione seu logo (PNG ou SVG, quadrado, 512×512 ou maior).
  2. Fundo — Escolha a cor de fundo se seu logo tiver transparência; ela também vira theme-color no snippet.
  3. Tamanhos — Marque os tamanhos que precisa (favicon 16/32, Apple 180, PWA 192/512, etc.).
  4. Baixar — Clique em qualquer prévia para baixar esse tamanho em PNG, ou “Baixar tudo em ZIP” para obter todos de uma vez.
  5. Snippet — Copie o bloco HTML e cole no <head> do seu site. Envie os PNG para o servidor (ex.: /assets/icons/) e ajuste os caminhos no snippet se necessário.

Onde colocar os arquivos

Um setup comum:

  • Coloque os PNG de favicon e ícones em uma pasta como /assets/icons/ ou na raiz.
  • Atualize o snippet para os href apontarem para esses caminhos (ex.: /assets/icons/favicon-32x32.png).
  • Adicione site.webmanifest para PWA com os mesmos caminhos para os ícones 192×192 e 512×512.

Resumo

O gerador de favicon e ícones de app permite ir de um logo a todos os tamanhos necessários e um snippet pronto para colar no <head>. Use uma imagem quadrada em boa resolução, baixe os PNG e encaixe o snippet no seu projeto.

  1. Envie uma imagem quadrada (PNG ou SVG, mínimo 512×512 recomendado).
  2. Escolha a cor de fundo e quais tamanhos gerar (favicon, Apple touch, PWA).
  3. Clique em uma prévia para baixar cada PNG e copie o snippet HTML no <head> do seu site.

Perguntas frequentes

Use pelo menos 512×512 pixels para melhor qualidade. Imagens quadradas funcionam melhor; a ferramenta redimensiona e centraliza seu logo.

Favicon padrão: 16×16 e 32×32. Apple: 180×180. PWA: 192×192 e 512×512. O snippet que geramos inclui esses.

Não. Tudo roda no seu navegador. Seu logo não sai do seu dispositivo.

Ferramentas relacionadas

Esta ferramenta é fornecida apenas para uso pessoal e educacional. Não hospedamos nem armazenamos nenhum conteúdo ou arquivo de mídia do usuário em nossos servidores. Todo o processamento ocorre localmente em seu navegador. Não somos afiliados nem endossados por nenhuma rede social, plataforma ou empresa mencionada. Use este serviço por sua conta e risco e em conformidade com os termos de serviço da respectiva plataforma.