feito para o dia do lançamento
Converta imagem em ícone online
O OneImageTool transforma um logotipo, avatar, mascote ou marca de produto nos arquivos de ícone que um site ou aplicativo de verdade precisa. Carregue uma imagem, ajuste em um quadrado limpo, veja a prévia em abas de navegador e telas de início e salve favicon.ico, ícones PNG, arquivos de Apple Touch Icon e um manifesto PWA. Se a origem ainda precisar de acerto, recorte em quadrado antes ou comprima uma exportação grande demais — as duas ferramentas também rodam no seu navegador.
Tudo roda no navegador. Isso importa quando a origem é o logotipo sigiloso de um cliente, a marca de um aplicativo ainda não lançado ou uma ideia rápida que você não quer mandar para outro servidor. Ajuste a margem interna, a cor de fundo e o arredondamento dos cantos acompanhando as prévias ao vivo nos aparelhos.
Favicon para sites
Crie o ícone da aba do navegador a partir da mesma origem. Use Recortar para uma marca marcante ou Encaixar com margem quando o logotipo precisar de respiro.
ICO de atalho
Baixe um ICO com vários tamanhos para o suporte a favicon antigo e para atalhos de desktop. Os tamanhos menores são calibrados para continuar nítidos na prévia da aba.
Ícones de app e PWA
Gere tamanhos maiores em PNG para telas de início e avisos de instalação. O pacote traz um manifesto web já configurado e o trecho de HTML.
Prévia em vários aparelhos
Diferente das prévias que mostram só a aba, o OneImageTool exibe maquetes da tela de início do iOS, do banner de instalação do Android e do bloco do Windows — todas atualizando ao vivo enquanto você edita.
um download, muitas superfícies
O que a ferramenta de imagem para ícone gera
Um bom fluxo de trabalho não entrega um único gráfico minúsculo. Páginas de destino, documentação, aplicativos, PWAs e projetos paralelos precisam de vários arquivos, além dos trechos de HTML. Pegue o conjunto compatível com navegadores em um único ZIP.
O pacote inclui favicon.ico, os tamanhos PNG mais comuns, um manifesto web, o trecho de HTML e um README — cobrindo a configuração normal de site e de PWA.
- favicon.icoICO
- favicon-16x16.png … 512x512.pngPNG
- apple-touch-icon.pngiOS
- android-chrome-192x192.pngPWA
- site.webmanifestJSON
- favicon-html.txtHTML
- README.txtDOC
cinco passos curtos
Como usar o conversor de imagem para ícone
Carregue
Arraste um PNG, JPG, WebP ou SVG. Origens quadradas funcionam melhor, mas imagens largas também servem.
Ajuste a forma
Escolha Encaixar, Recortar ou Esticar. Acompanhe as prévias de navegador, iOS e Android mudando na hora.
Dê estilo
Acrescente margem interna, arredonde os cantos, mantenha a transparência ou escolha um fundo sólido.
Confira
Olhe a aba em 16px e as maquetes de tela de início. Se o ícone da aba ficar ilegível, aumente a margem ou use um fundo sólido.
Baixe
Salve o pacote completo com favicon.ico, arquivos PNG, manifesto, trecho de HTML e README.
do minúsculo ao pronto para instalar
Melhores tamanhos na saída de imagem para ícone
Os ícones aparecem em lugares bem diferentes. Uma aba de navegador pede um símbolo marcante, quase sem detalhe. Uma tela de instalação de PWA comporta uma marca maior. Este conversor cria todos os tamanhos comuns a partir de uma única imagem.
| Tamanho | Uso comum | Prévia na ferramenta | Dica |
|---|---|---|---|
| 16×16 | Abas do navegador, favicon antigo | Maquete da aba | Use uma silhueta marcante, com pouco detalhe |
| 32×32 | Favicon PNG moderno, abas em alta definição | Grade de tamanhos | Padrão prático para o HTML do favicon |
| 48×48 | Atalhos de desktop, blocos do Windows | Maquete do bloco do Windows | Mantenha a forma centralizada |
| 180×180 | Apple Touch Icon | Maquete da tela de início do iOS | Um fundo sólido costuma ficar mais limpo no iOS |
| 192×192 | Chrome no Android, PWA | Maquete de instalação no Android | Usado nos ícones do manifest.json |
| 512×512 | Splash de PWA, tela de instalação | Grade de tamanhos | Comece por uma origem de alta qualidade |
deixe a versão minúscula legível
Lista de conferência antes de baixar
Favicons são pequenos — linhas finas, textos minúsculos, fotos cheias de elementos e capturas de tela costumam virar um borrão. Use as prévias ao vivo da aba e da tela de início para testar a legibilidade antes de exportar.
Se a prévia da aba em 16px estiver difícil de ler, experimente um recorte mais fechado, mais margem interna ou um fundo sólido. Formas centralizadas e com bom contraste aguentam muito melhor o salto de imagem grande para ícone.
Logotipos simples, mascotes chapados, marcas quadradas, iniciais marcantes e símbolos de alto contraste.
Fotos detalhadas, contornos finos, capturas de tela, palavras longas e marcas que encostam nas bordas.
cole e publique
Onde colocar os arquivos de ícone gerados
Em sites estáticos, deixe os arquivos na raiz pública ou em uma pasta de recursos copiada para produção. Cole o trecho de HTML dentro do <head>. Mantenha as URLs do favicon estáveis depois do lançamento, para favoritos e atalhos instalados continuarem com o mesmo ícone.
O cache de favicon é teimoso durante os testes — use uma janela anônima ou renomeie os arquivos enquanto experimenta.
public/
├── favicon.ico
├── favicon-32x32.png
├── apple-touch-icon.png
├── android-chrome-192x192.png
├── android-chrome-512x512.png
└── site.webmanifest