Criado com IA avançada no seu dispositivo e aceleração de hardware para um desempenho profissional com privacidade total.IA no seu dispositivo — profissional e privado.
Gerador de favicon
Gerador de favicon: todos os tamanhos e o HTML.
- Funciona no seu dispositivo
- ICO, PNG, SVG e manifesto
- Um logotipo grátis · 20 com Pro
Solte um logotipo aqui
PNG, JPG, WebP, AVIF, GIF, BMP ou SVG · até 25.0 MB
O Android recorta os ícones à forma do dispositivo — afaste o motivo da margem.
Mosaicos do Windows, densidades do Android e passagem do vetor fazem parte do Pro.
Vão para o site.webmanifest e para a etiqueta theme-color.
Por que um gerador de favicon?
Um gerador de favicon cria o pequeno ícone que aparece nas abas, nos favoritos e na tela inicial do celular — tornando a sua marca reconhecível onde de outro modo ficaria sem nome.
Vantagens de um conjunto de favicons
- Identidade do site: Um ícone reconhecível para o seu site.
- Vários tamanhos: Ícones para telas normais e de alta resolução.
- Cobertura de formatos: ICO com vários tamanhos embutidos, PNG ao lado e um vetor que continua vetor.
- Fluxo rápido: Solte o logotipo, escolha o enquadramento, baixe um ZIP.
- Resultado cuidado: Cada tamanho é obtido por média a partir do original em resolução total, para que nada fique irregular a 16 px.
Como criar um favicon
- Traga o seu motivo: Solte um logotipo — PNG, JPG, WebP, AVIF, GIF, BMP ou SVG. Não tem logotipo? Mude para Texto e digite uma ou duas letras, ou escolha um emoji.
- Escolha o enquadramento: Ajustar mantém o logotipo inteiro e preenche o resto, Preencher corta até às margens, Esticar ignora a forma. Acrescente margem se o Android for recortar o seu ícone, e arredonde os cantos se os quiser redondos.
- Defina os fundos: Deixe o ícone transparente ou dê-lhe uma cor. O fundo do iPhone define-se à parte — o iOS não aceita transparência aí e mostra um ícone translúcido sobre preto.
- Dê nome ao site: O nome, o nome curto e a cor do tema vão para site.webmanifest e para a etiqueta theme-color, que é o que o pedido de instalação lê.
- Baixe e instale: Um toque gera um ZIP. Coloque todos os arquivos na raiz do seu site e cole no head as etiquetas link copiadas.
Como o favicon é criado
O seu logotipo é reduzido a cada tamanho de ícone no seu dispositivo e depois escrito em favicon.ico, no conjunto de PNG, em site.webmanifest e no HTML que os referencia.
Processo de criação do favicon
- Carregamento: O seu arquivo é decodificado uma vez e mantido, por isso mudar uma configuração nunca o lê de novo.
- Enquadramento: O logotipo é ajustado, preenchido ou esticado num quadrado, com a sua margem e o seu arredondamento.
- Redução: Cada tamanho parte do original, nunca do tamanho acima, para que nenhum herde a falta de nitidez de outro.
- Placas de plataforma: O ícone do iPhone recebe um fundo opaco, porque o iOS mostra um fundo transparente sobre preto.
- Empacotamento: O favicon.ico leva as entradas de 16, 32 e 48; os PNG, o manifesto e o marcado são escritos ao lado.
- Resultado: Um ZIP com todos os arquivos, cada um com o nome que os passos de instalação esperam.
O que vem no pacote
- Tamanhos de ícone: Favicons PNG de 16, 32, 48 e 96 px, um ícone de iPhone de 180 px e ícones de aplicativo de 192 e 512 px.
- favicon.ico: Um arquivo com entradas de 16, 32 e 48 px, escrito para ser lido tanto pelos navegadores de secretária como pelo Windows.
- site.webmanifest: O manifesto e os dois tamanhos de ícone sem os quais não aparece o pedido de instalação.
- Marcado: As etiquetas link para colar no seu head, prontas a copiar com um toque.
- Pacotes de plataforma: Mosaicos do Windows, densidades do Android e passagem do vetor com o Pro.
Quando usar um gerador de favicon
Ao lançar um site, ao mudar de identidade, ao preparar a instalação de um aplicativo ou ao cumprir as regras de ícones de uma plataforma.
Casos de uso
- Desenvolvimento web: Entregar o favicon.ico ao lado do index.html.
- Coerência de marca: Alinhar o ícone da aba com o logotipo ou a marca.
- Celular: Acrescentar o apple-touch-icon e os tamanhos da tela inicial.
- Windows: Gerar as imagens dos mosaicos para sites afixados.
- Trabalho para clientes: Entregar um conjunto completo de ícones de uma só vez.
Fatos sobre favicons
Motivos simples e de contraste elevado leem-se melhor a 16×16. Comece por um original quadrado de pelo menos 512×512 sempre que possível.
Números principais
- 16×16 e 32×32 são os tamanhos de favicon mais comuns.
- Um arquivo ICO pode armazenar vários bitmaps num só arquivo.
- Os favicons PNG são flexíveis mas exigem um arquivo por tamanho — daí o ZIP.
- Os favicons aparecem nas abas, no histórico e na barra de favoritos.
- Quanto melhor o original, menos suavidade indesejada depois da redução.
Boas práticas
Prefira formas fortes, teste em abas reais e verifique o contraste em barras claras e escuras.
Questões de qualidade
- Use um original nítido e quadrado.
- Evite texto pequeno ou traços finos que desaparecem em baixa resolução.
- Veja o resultado em telas normais e de alta resolução.
- Mantenha as cores da marca coerentes com o cabeçalho do site.
Quando não usar
- Fotografias muito detalhadas que ficam borradas a 16×16.
- Originais de resolução muito baixa.
- Motivos que dependem de gradientes com menos de alguns pixels.
- Casos em que só se pretende entregar um vetor — para isso serve um programa de desenho.
Com algoritmos otimizados de processamento de imagem.
Perguntas frequentes
Que tamanho deve ter a imagem de origem?
De preferência quadrada (proporção 1:1) e com pelo menos 512×512 pixels; 1024×1024 é ainda melhor. A redução para cada tamanho de ícone é feita pela ferramenta, e cada tamanho parte do original e não do tamanho acima.
Qual é a diferença entre favicons ICO e PNG?
O ICO é o contêiner mais antigo e armazena vários tamanhos num só arquivo; o PNG é um arquivo por tamanho e é o preferido dos navegadores modernos. Não tem de escolher — o pacote inclui ambos, porque os navegadores de secretária, os atalhos do Windows e os leitores de feeds não leem o mesmo arquivo.
Que tamanhos de favicon devo gerar?
Todos, e é por isso que o pacote é fixo em vez de uma lista de caixas. 16 e 32 cobrem as abas e as abas de alta resolução, 48 cobre os atalhos do Windows, 96 os atalhos da área de trabalho, 180 é a tela inicial do iPhone, e 192 e 512 são os dois tamanhos sem os quais não aparece o pedido de instalação.
Como adiciono o favicon ao meu site?
Coloque todos os arquivos na raiz do seu site — a mesma pasta do index.html. O favicon.ico é procurado aí automaticamente; para os restantes, cole no seu head as etiquetas link que a ferramenta já lhe entrega prontas a copiar.
O que faz um bom favicon?
Um bom favicon é simples, continua reconhecível em tamanho pequeno, tem contraste elevado e assenta em formas ou letras fortes em vez de pormenores finos. Logotipos, iniciais e ícones simples funcionam melhor; imagens complexas deixam de se perceber a 16×16.
Tenho de baixar os arquivos um a um?
Não. Um toque produz um único ZIP com todos os arquivos, cada um já com o nome que os passos de instalação esperam. Baixar uma dúzia de ícones através de uma dúzia de janelas de gravação é algo que o navegador bloqueia ao fim de alguns — por isso o arquivo é a única exportação, e é gratuito.
A minha imagem fica armazenada ou é compartilhada?
Não. O seu logotipo nunca sai da máquina onde está trabalhando — todo o pacote, incluindo o ICO e o arquivo, é criado no seu dispositivo e nada é enviado para lugar nenhum.
de 546 avaliações
Avalie esta ferramenta
Toque numa estrela — leva um segundo