Gerador de favicon

Largue o seu logótipo, escolha margem, fundo e cantos, e transfira todos os ícones de que um site precisa, com o código HTML para colar na página.

Sobre esta ferramenta

Todos os ícones do seu site a partir de uma só imagem

Navegadores, iPhones e telemóveis Android querem cada um o seu ícone. Esta ferramenta cria-os todos de uma vez, no seu dispositivo.

Um verdadeiro ICO com vários tamanhos

O favicon.ico inclui versões de 16, 32 e 48 px, por isso o separador, os marcadores e a barra de tarefas do Windows têm cada um um ícone nítido. Os tamanhos pequenos são reduzidos por etapas para que as linhas finas não se partam.

Pronto para telemóveis

apple-touch-icon.png (180 px) para o ecrã principal do iPhone, ícones de 192 e 512 px para Android e um site.webmanifest com o nome do site e a cor do tema.

Pré-visualização antes de transferir

Pré-visualização do separador em claro e escuro, e todos os tamanhos lado a lado. Aceita logótipos PNG, JPG, WebP e SVG; a transparência mantém-se onde é permitida.

Como funciona

  1. Largue um logótipo ou imagem (PNG, JPG, WebP ou SVG) ou cole-o com Ctrl + V.
  2. Escolha «Ajustar com margem» ou «Preencher e recortar»; depois a margem, o fundo e os cantos arredondados.
  3. Escreva o nome do site e a cor do tema para o web manifest.
  4. Clique em «Criar favicon», transfira o ZIP e copie o código HTML para o <head> da sua página.

Perguntas frequentes

As minhas imagens são enviadas para um servidor?

Não. Cada imagem é lida, processada e guardada no separador do seu navegador com Canvas, Web Workers e WebAssembly. Nada é enviado, armazenado ou registado.

Que ficheiros vêm no ZIP?

favicon.ico (16, 32 e 48 px), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180 px), android-chrome-192x192.png, android-chrome-512x512.png, site.webmanifest e um ficheiro HTML com as etiquetas para colar na página. Partindo de um SVG, junta-se favicon.svg.

Onde coloco os ficheiros do favicon?

Carregue-os para a pasta raiz do site, ao lado da página inicial, e cole o código HTML no <head> de cada página. Os navegadores também procuram /favicon.ico por si.

Porque é que o ícone da Apple tem fundo?

O iOS mostra sobre preto os ícones transparentes do ecrã principal. Se mantiver o fundo transparente, só o ícone da Apple recebe um fundo branco; o iOS arredonda os cantos sozinho.

Posso criar um favicon a partir de um SVG?

Sim. O ZIP inclui então também favicon.svg com a sua margem, fundo e cantos, que os navegadores modernos preferem por ser nítido em qualquer tamanho. Os ícones PNG e ICO são desenhados a partir do SVG a 1024 px e reduzidos, por isso até o de 16 px fica nítido.

É gratuito? Fica com marca de água?

Sim, pode usá-lo gratuitamente sem conta, e o Toolula nunca acrescenta marca de água. O plano gratuito tem limites de utilização razoável; o Toolula Pro, um plano opcional, aumenta-os.