Como usar
- Cole a string Base64 ou o data URI de um ícone ou da imagem que você quer transformar em ícone.
- Confira a prévia e as dimensões. Uma imagem de origem quadrada gera o ícone mais nítido.
- ICO já vem pré-selecionado. Em Tamanho do ícone, escolha um tamanho (16, 32, 48, 64, 128 ou 256 pixels) ou Vários tamanhos.
- Baixe o arquivo .ico. Se a entrada já for um ICO e você quiser manter todas as imagens dele sem alterações, escolha Original.
Arquivos ICO em Base64
Um arquivo ICO é um pequeno contêiner: um cabeçalho, um diretório de entradas e uma imagem por entrada, cada uma armazenada como dados BMP ou PNG. O cabeçalho começa com os bytes 00 00 01 00, então o Base64 de um ícone começa com AAABAA. Você vai encontrar ícones em Base64 em data URIs de favicon como <link rel="icon" href="data:image/x-icon;base64,...">, em páginas HTML de arquivo único e em APIs que retornam ícones de sites.
O tipo MIME registrado é image/vnd.microsoft.icon, mas image/x-icon é muito mais comum e funciona em todo lugar.
Qual tamanho de ícone escolher
| Tamanho | Uso típico |
|---|---|
| 16 × 16 | Aba do navegador e favoritos em telas comuns |
| 32 × 32 | Aba do navegador em telas de alta densidade |
| 48 × 48 | Ícones da área de trabalho e do Explorador de Arquivos do Windows |
| 64, 128 | Prévias maiores e listas de aplicativos |
| 256 × 256 | Modos de exibição com ícones grandes e extra grandes no Windows |
A opção Vários tamanhos reúne 16, 32, 48 e 256 em um único arquivo, para que cada sistema escolha o mais adequado. As imagens internas são comprimidas em PNG, o que preserva a transparência e é compatível com o Windows Vista e versões posteriores e com todos os navegadores modernos.
Como usar o ícone como favicon
Os navegadores solicitam /favicon.ico na raiz do site automaticamente, então salvar o arquivo lá funciona mesmo sem nenhuma marcação. Um data URI em Base64 no href economiza essa requisição, mas o ícone passa a ser baixado de novo com cada página, em vez de ficar em cache separadamente. Os navegadores modernos também aceitam ícones PNG e SVG, e uma configuração comum combina os dois:
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" href="/icon.svg" type="image/svg+xml">Comece com uma imagem quadrada, de formas simples e contraste forte; detalhes finos desaparecem em 16 pixels. Para obter uma versão PNG para outros usos, experimente Base64 para PNG.
Perguntas frequentes
Qual deve ser o tamanho do favicon.ico?
Um ícone com imagens de 16, 32 e 48 pixels atende aos navegadores e ao Windows. A opção Vários tamanhos desta ferramenta também adiciona 256 para os modos de exibição com ícones grandes.
Posso converter um PNG ou SVG em Base64 para ICO?
Sim. Cole os dados, deixe Baixar como em ICO e escolha um tamanho. Qualquer imagem que o seu navegador consiga exibir pode ser convertida.
Por que a prévia mostra só um tamanho do meu ícone?
Um arquivo ICO pode conter várias imagens, mas a prévia mostra apenas uma delas. Baixe como Original para manter todas as imagens do arquivo.
O ICO mantém a transparência?
Sim. Os ícones são armazenados como dados PNG com canal alfa completo, então cantos arredondados e bordas suaves continuam transparentes.
Como coloco um ícone em um data URI?
href da sua tag <link rel="icon">.