Conversor de favicon
Crie, a partir de uma única imagem raster, os arquivos necessários para adicionar um favicon a um site. Escolha como a imagem de origem deve se ajustar à tela quadrada, defina o fundo e baixe um ZIP com um ICO em vários tamanhos, sete ícones PNG, um manifesto de aplicativo web, a configuração de blocos do Windows e um trecho HTML pronto para copiar no cabeçalho. A conversão da imagem e a montagem do ZIP são feitas localmente no seu navegador.
Como converter uma imagem em um pacote de favicon
-
1
Escolha uma imagem raster
Selecione um PNG, JPEG ou WebP que respeite os limites exibidos de tamanho do arquivo e dimensões da imagem. Arquivos SVG, GIF e AVIF não são aceitos.
-
2
Escolha o ajuste
Use Cobrir para preencher o quadrado e cortar as bordas, ou Conter para manter a imagem inteira e adicionar espaço ao redor.
-
3
Defina o fundo
Escolha uma cor de fundo para os pixels transparentes e para o espaço criado no modo Conter. Depois, confira as prévias geradas.
-
4
Baixe e instale
Baixe o ZIP, coloque os arquivos de ícone e configuração no seu site e copie as tags de link fornecidas para o cabeçalho do documento.
Conteúdo do ZIP
| Item do pacote | Finalidade |
|---|---|
favicon.ico |
Um contêiner ICO com versões de 16, 32, 48 e 256 px para navegadores e programas que solicitam o caminho tradicional do favicon |
favicon-16x16.png |
PNG compacto para abas do navegador e outros espaços pequenos |
favicon-32x32.png |
Ícone com maior densidade para abas e favoritos do navegador |
favicon-48x48.png |
Tamanho adicional para área de trabalho e atalhos |
mstile-150x150.png |
PNG de 150 × 150 referenciado pela configuração de blocos do Windows |
apple-touch-icon.png |
PNG de 180 × 180 para links na tela inicial de dispositivos Apple |
android-chrome-192x192.png |
Ícone de aplicativo de 192 × 192 referenciado pelo manifesto web |
android-chrome-512x512.png |
Ícone de aplicativo de 512 × 512 referenciado pelo manifesto web |
site.webmanifest |
Metadados JSON que indicam aos navegadores compatíveis os ícones de 192 e 512 px |
browserconfig.xml |
Configuração de blocos do Windows que referencia os ícones gerados |
favicon-head.html |
Tags prontas para copiar que conectam a página ao ICO, aos PNGs, ao ícone da Apple, ao manifesto e à configuração do navegador |
Os arquivos ICO e PNG são separados de propósito. Navegadores e sistemas operacionais escolhem ícones de formas diferentes. Por isso, um pacote completo atende tanto à solicitação tradicional de /favicon.ico quanto às declarações explícitas de ícones modernos.
Tags HTML para o cabeçalho
O pacote baixado inclui um trecho neste formato:
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="msapplication-config" content="/browserconfig.xml">
Se os arquivos estiverem em uma subpasta ou em um servidor de recursos separado, altere os caminhos antes de colar as tags em <head>. Mantenha os nomes de arquivo e os caminhos em site.webmanifest e browserconfig.xml de acordo com os arquivos publicados.
Cobrir, conter e escolher o fundo
- Cobrir preenche completamente cada saída quadrada. Uma imagem larga ou alta é cortada de modo uniforme nas bordas opostas, então mantenha a parte importante do desenho perto do centro.
- Conter mantém toda a imagem visível. O espaço não usado vira uma margem na cor de fundo selecionada.
- Fundo pode continuar transparente ou usar uma cor sólida personalizada. No modo Conter, essa escolha também controla a cor da margem ao redor da imagem. Confira as prévias em fundos de página claros e escuros antes de publicar.
Para obter ícones pequenos mais nítidos, comece com uma imagem quadrada simples de pelo menos 512 × 512 pixels. Letras finas, traços muito delicados e pequenos detalhes podem desaparecer na versão de 16 px, mesmo quando a imagem de origem é grande.
Limites de entrada e instalação
Este conversor aceita somente imagens raster PNG, JPEG e WebP. Ele verifica a assinatura da imagem e rejeita SVG, GIF, AVIF e qualquer outro formato não listado. A imagem de origem pode ter até 20 MiB, nenhum lado pode ultrapassar 8.192 pixels e o total não pode exceder 24 megapixels. Os limites de dimensões são verificados antes de a imagem inteira ser decodificada.
Depois de baixar, extraia o ZIP e envie os arquivos gerados para os caminhos usados no trecho fornecido. Caminhos relativos à raiz, como /favicon.ico, pressupõem que os arquivos estejam disponíveis na raiz do domínio atual. Ao substituir um favicon existente, limpe o cache do site ou da CDN, pois os navegadores costumam guardar arquivos de ícone por mais tempo do que recursos comuns da página.
O manifesto incluído fornece metadados dos ícones, mas um manifesto e um conjunto de ícones, sozinhos, não tornam um site um aplicativo web progressivo instalável. A instalação também depende da página, da segurança do transporte e dos requisitos de cada navegador.
Perguntas frequentes
Você pode usar PNG, JPEG ou WebP. O conversor verifica a assinatura do arquivo em vez de confiar apenas no nome e rejeita SVG, GIF, AVIF e outros formatos.
Cobrir amplia a imagem até preencher o quadrado e corta partes iguais das bordas quando a proporção não é quadrada. Conter mantém a imagem inteira e preenche o espaço restante do quadrado com a cor de fundo selecionada.
ICO é um contêiner que pode armazenar vários tamanhos pequenos de ícone em um único arquivo favicon tradicional. Arquivos PNG separados oferecem a navegadores e plataformas recursos com tamanhos definidos para abas, links da tela inicial e ícones de aplicativos. Manter os dois melhora a compatibilidade na prática.
Não. O manifesto descreve os ícones de aplicativo gerados e os metadados de exibição relacionados, mas a possibilidade de instalação depende de requisitos adicionais do navegador e de como o site foi criado e é servido.
O trecho fornecido usa caminhos relativos à raiz, então a configuração mais simples é colocar os arquivos extraídos na raiz do domínio. Se você usar outra pasta ou um servidor de recursos, atualize o trecho e os caminhos no manifesto e na configuração do navegador.
Não. O processamento da imagem e a criação do ZIP ocorrem no seu navegador. No fluxo de várias etapas, um rascunho do IndexedDB pode manter a imagem neste navegador por até 30 minutos para transferi-la entre as etapas. Essa transferência local não é um envio ao servidor.
Ferramentas relacionadas
Gerador de papel quadriculado
Crie papel quadriculado para imprimir online: escolha grade ou pontos, ajuste o espaçamento em mm, selecione A4 ou Carta e uma cor de linha personalizada, e imprima ou baixe um SVG nítido.
Criador de gráficos de ponto cruz
Transforme JPEG, PNG ou WebP em gráfico de ponto cruz imprimível com 10–150 pontos, 2–40 cores próprias, símbolos, contagens exatas e medidas do tecido.
Conversor de Pantone para HEX
Converta cores Pantone PMS para os valores mais próximos de HEX, RGB e CMYK para correspondência em tela e impressão, com pré-visualização de amostras.
Gerador de papel pautado
Crie papel pautado para imprimir de graça. Escolha pauta média, larga ou estreita, defina o espaçamento das linhas em mm, o tamanho da página e uma linha de margem, e imprima ou baixe o SVG.
Divisor de Grade do Instagram
Divida uma imagem ampla em uma grade 3×3 do Instagram, ou qualquer número de linhas. As peças são numeradas para facilitar o upload em ordem inversa.
Gerador de retícula de meio-tom
Transforme uma foto em uma retícula AM ajustável, monocromática, com cores amostradas ou em estilo CMYK, e baixe em PNG ou SVG vetorial.
Ferramenta disponível em outros idiomas
- ファビコン変換ツール [JA]
- Faviconkonverterare [SV]
- Favicon-Konverter [DE]
- Konverter Favicon [ID]
- Konwerter favicon [PL]
- Favicon-converter [NL]
- Convertisseur de favicon [FR]
- Conversor de favicon [ES]
- محوّل أيقونة الموقع [AR]
- Trình chuyển đổi favicon [VI]
- 파비콘 변환기 [KO]
- เครื่องมือแปลง Favicon [TH]
- Favicon Converter [EN]
- Convertitore di favicon [IT]
- Конвертер фавиконов [RU]
- Favicon Dönüştürücü [TR]
- Favicon 转换器 [ZH]