Como usar: Gerador de favicon
- 1
Escolha uma origem
Envie um logo ou uma imagem de até 25 MB, digite de uma a três letras em uma de 11 fontes ou escolha um emoji.
- 2
Crie o ícone
Escolha entre 12 opções de Forma, de nenhuma ou um quadrado simples até um biscoito ou trevo, e defina uma cor de Fundo ou transparência, a Margem interna e o Raio dos cantos.
- 3
Confira todos os tamanhos
Veja o ícone de 16 a 192 pixels, em abas de navegador claras e escuras e dentro da zona segura maskable do Android.
- 4
Baixe e instale
Salve o favicon.zip, descompacte na pasta do seu site e cole o HTML gerado no head da página.
Limites e Pro
Conjuntos de ícones ilimitados a partir de texto ou emoji; imagens de até 25 MB, uma por vez. Cada conjunto tem 10 arquivos.
O Pro aumenta o limite de envio de imagens de logo para 4 GB. Ver o Pro
Sobre: Gerador de favicon
O gerador de favicon cria a partir de um único design o conjunto completo de ícones que um site moderno precisa. O ZIP traz o favicon.ico com imagens de 16, 32 e 48 pixels, PNGs separados de 16, 32 e 48 pixels, um apple-touch-icon de 180 pixels com fundo opaco (o iOS adiciona os próprios cantos arredondados), ícones Android Chrome de 192 e 512 pixels, um ícone maskable de 512 pixels cujo conteúdo fica dentro da zona segura de 80%, um site.webmanifest com o nome do app, o nome curto e a cor do tema, e um trecho de HTML pronto para colar com as tags link e theme-color. Todos os PNGs são otimizados sem perdas.
As imagens enviadas são reduzidas com um filtro Lanczos, então um logo grande continua nítido mesmo em 16 pixels, e um logo em SVG é desenhado antes a 1.024 pixels. Os ícones de texto usam a fonte que você escolher e os emojis usam a fonte Noto Color Emoji, para que o resultado seja igual no sistema de qualquer visitante. Se os ícones não ficarem na raiz do site, digite a pasta, por exemplo /icons/, e os caminhos no trecho e no manifest acompanham.
Os usos típicos são um site ou blog novo, um web app que as pessoas instalam na tela inicial, um painel interno que precisa se destacar entre as abas do navegador ou um ícone provisório para um projeto pessoal. Detalhes finos e palavras longas somem em 16 pixels, então formas simples e uma ou duas letras funcionam melhor. A ferramenta não hospeda os arquivos nem edita o seu site; você mesmo os envia.
Privacidade
Os ícones são desenhados em canvas nesta aba e codificados pelo codec PNG em WebAssembly do site, dentro de um Web Worker, então um logo enviado nunca sai do seu dispositivo. Se você escolher uma das fontes do Google ou a origem Emoji, o navegador baixa essa fonte do Google Fonts quando você começa a editar; a requisição informa a fonte, nunca o seu texto, e nada é buscado ao carregar a página.
Recursos
Conjunto completo de ícones
ICO, PNGs em vários tamanhos, Apple touch icon, ícones Android e maskable e um web manifest em um único ZIP.
Imagem, texto ou emoji
Use seu logo, de uma a três letras em 11 fontes ou qualquer emoji como origem.
Formas expressivas
Quadrado, arredondado, círculo e oito formas Material, com controles de margem interna e raio dos cantos.
HTML pronto para colar
Tags link, cor do tema e caminhos do manifest são gerados para a pasta que você escolher.