QuokkaPix

Gerador de favicon

Crie favicon e ícones de aplicativo a partir de uma imagem

Use esta página quando um logotipo ou marca quadrada precisa virar um pacote de ícones para site, aplicativo web ou PWA. QuokkaPix exporta tamanhos PNG comuns localmente, para revisar nitidez e margens antes de adicionar ao projeto.

Sem uploadLocal no navegadorGrátis
O botão abaixo abre o editor do QuokkaPix com esta ferramenta já selecionada.

O que esta ferramenta faz

Gere favicon, Apple touch icon e ícones PNG para PWA localmente no navegador sem enviar o logotipo.

16 a 512 px
ZIP local
Ícones web e PWA

Como funciona

1
Carregue um logotipo quadrado ou centralizado.
2
Abra o pacote favicon/app icon.
3
Revise margens, contraste e forma em tamanhos pequenos.
4
Baixe o ZIP com ícones PNG.

FAQ

Meu logotipo é enviado?

Não. A geração de ícones roda localmente no navegador.

Quais tamanhos são gerados?

O pacote inclui tamanhos comuns como 16, 32, 48, 180, 192 e 512 px.

Verificações práticas

Um favicon não é apenas um ícone quadrado

Um conjunto de favicon precisa funcionar em abas do navegador, favoritos, atalhos fixados e pequenas prévias móveis. Comece com uma marca simples e de alto contraste, evitando texto que desaparece em 16 px. Exporte os tamanhos esperados e confira se a menor versão ainda é reconhecível sem depender apenas da cor. Guarde o ícone mestre separadamente, porque os arquivos favicon gerados são assets de entrega, não a fonte do design.

1
Use uma forma simples com contraste forte.
2
Confira 16 px e 32 px antes de publicar.
3
Mantenha o logotipo ou ícone fonte separado dos favicons gerados.

Teste 16 px antes de confiar no pacote inteiro

Um favicon falha primeiro no menor tamanho. Antes de usar o ZIP gerado, abra os PNG de 16 px e 32 px separadamente, não apenas o ícone grande de 512 px. Texto fino, mascotes detalhados e logotipos horizontais costumam sumir na aba do navegador. Uma boa fonte geralmente é uma marca simplificada, com contraste forte e espaço suficiente ao redor. Guarde a arte original da marca separadamente para regenerar o pacote com outro corte ou fundo.

1
Confira 16 px e 32 px como arquivos reais.
2
Evite marcas com texto pequeno demais.
3
Guarde um master quadrado limpo para futuros pacotes.

Páginas relacionadas

Se você precisar do próximo passo, abra a ferramenta correta e continue no mesmo editor.