Converter SVG para ICO

Começar um favicon a partir de um SVG é o cenário ideal: cada tamanho de ícone é desenhado do zero a partir do vetor, em vez de ser reduzido de um bitmap grande, e assim a versão de 16 px fica tão nítida quanto a grade de pixels permite.

ou solte arquivos JPG, JPEG, JPE … aqui ·

Até 95 MB por arquivo· Até 20 arquivos· Apagados após 30 minutos

Saída

Converter para

Os arquivos são processados em nossos servidores e apagados após 30 minutos.

Como usar esta ferramenta

1
Envie o logo em SVG
Use o símbolo ou o monograma, não o logotipo completo com o nome. Um viewBox quadrado dá o resultado mais nítido.
2
Mantenha todos os tamanhos de ícone
Tamanhos do ícone começa em Todos os tamanhos (16–256), que reúne todas as resoluções em um único .ico. Escolha um tamanho só quando um programa pedir exatamente um.
3
Clique em Converter para ICO
Salve o arquivo como favicon.ico na pasta raiz do seu site ou aponte um atalho do Windows para ele.

Resposta

Como converter SVG em ICO para um favicon?

Envie o SVG, mantenha Tamanhos do ícone em Todos os tamanhos (16–256) e clique em Converter para ICO. Você recebe um .ico com todas as resoluções geradas a partir do vetor, com a transparência preservada.

Converter SVG para ICO: por que o vetor é a fonte certa

O formato .ico vem das primeiras versões do Windows, e a convenção do favicon.ico vem do Internet Explorer 5, em 1999, que procurava um arquivo com esse nome na raiz de cada site adicionado aos favoritos. Um ICO é um pequeno contêiner: um diretório de entradas, cada uma um bitmap quadrado separado, de modo que um só arquivo pode guardar um ícone de aba de 16 px e um ícone de área de trabalho de 256 px lado a lado. O Windows Vista elevou o máximo para 256 × 256 e permitiu que essas entradas grandes fossem armazenadas como PNG.

Como cada entrada é um bitmap próprio, a qualidade de um ícone depende de como cada tamanho foi produzido. A partir de um PNG, cada tamanho é uma redução dos mesmos pixels. A partir de um SVG, cada tamanho é uma nova renderização dos caminhos, com suavização calculada para aquela grade exata. Em 16 × 16 px, onde um logo tem 256 pixels para trabalhar, essa diferença é visível.

1:1

16 × 16 px

16 × 16

Abas do navegador, favoritos e listas de histórico.

1:1

32 × 32 px

32 × 32

Abas em telas de alta densidade, atalhos na barra de tarefas do Windows.

1:1

64 × 64 px

64 × 64

Visualizações ampliadas da área de trabalho e itens fixados.

1:1

128 × 128 px

128 × 128

Pré-visualizações grandes em gerenciadores de arquivos.

1:1

256 × 256 px

256 × 256

A maior entrada do ICO; ícones extragrandes do Explorador.

SVG

Scalable Vector Graphics (SVG)

SVG é um formato vetorial baseado em XML, padronizado pelo W3C em 2001. Em vez de pixels, ele descreve formas, caminhos e texto, por isso fica nítido em qualquer tamanho e costuma ser minúsculo para logotipos e ícones. Ele aceita transparência, estilo com CSS, scripts e animação, e todos os navegadores o renderizam nativamente. O SVG não é adequado para fotografias, e ilustrações complexas podem ficar lentas para renderizar. Illustrator, Inkscape, Figma e os navegadores conseguem abri-lo e editá-lo.

Compressão: –
Transparência: Sim
Animação: Sim
Lançamento: 2001 · W3C

Conversor de SVG

ICO

Ícone do Windows

ICO é o formato de ícone da Microsoft usado nos ícones de programas do Windows e nos favicons de sites. Um único arquivo .ico pode conter várias imagens em tamanhos diferentes, como 16×16, 32×32, 48×48 e 256×256 pixels, para que o sistema escolha a mais adequada. Cada imagem pode ser armazenada como bitmap ou como dados PNG e suporta transparência alfa completa. O ICO não foi feito para fotos nem para artes grandes. Navegadores, o Windows e a maioria dos editores de ícones conseguem lê-lo.

Compressão: Sem perdas
Transparência: Sim
Animação: Não
Lançamento: Microsoft

Conversor de ICO

As pessoas convertem SVG em ICO porque o logo existe como vetor e a raiz do site, um atalho do Windows ou um aplicativo de desktop ainda espera um arquivo .ico com vários tamanhos de bitmap.

Prepare o SVG antes de converter SVG para ICO

Faça	Não faça
Defina o viewBox como um quadrado, como `0 0 512 512`.	Depender de traços finíssimos que somem abaixo de 32 px.
Deixe uma pequena margem para que o símbolo não encoste na borda do ícone.	Manter um logotipo largo que vira um borrão fino.
Converta o texto em contornos para que a fonte não mude.	Referenciar imagens externas ou fontes da web dentro do SVG.
Use o símbolo ou as iniciais, não o nome completo.	Adicionar um retângulo branco atrás do logo, a menos que você queira isso também nas abas escuras.

O conversor renderiza o que o SVG descreve e nada além disso, então recursos vinculados e fontes não incorporadas não podem ser buscados. Ferramentas de design como Figma, Illustrator e Inkscape exportam texto como caminhos; faça isso e as letras ficarão iguais à sua marca em qualquer lugar.

Com o .ico pronto, adicione um PNG de 180 px para os ícones Apple touch e o próprio SVG para os navegadores que aceitam favicons vetoriais; SVG para PNG gera o PNG em qualquer tamanho. Se a sua origem for um logo em bitmap, PNG para ICO faz o mesmo trabalho a partir dos pixels.

Converter SVG para ICO: perguntas frequentes

Por que converter SVG para ICO em vez de partir de um PNG?

Um PNG precisa ser reduzido para cada tamanho de ícone, e a redução borra as bordas. Um SVG é renderizado diretamente em 16, 32, 64, 128 e 256 px, então cada tamanho recebe bordas nítidas para a sua própria grade de pixels.

Os navegadores ainda precisam do favicon.ico se o meu site tem um ícone SVG?

Chrome e Firefox leem um favicon SVG declarado com uma tag link, mas muitos navegadores, leitores de feeds e rastreadores ainda pedem /favicon.ico na raiz do site por padrão. Oferecer os dois cobre tudo.

O que acontece se o meu SVG não for quadrado?

Os espaços de ícone são quadrados, então um logo largo fica com margens vazias ou parece minúsculo. Edite o viewBox para que largura e altura sejam iguais ou recorte uma versão quadrada com a ferramenta cortar imagem depois de exportar um PNG.

O fundo transparente é mantido no ICO?

Sim. O ICO guarda um canal alfa, então as áreas sem preenchimento no SVG continuam transparentes e o ícone fica limpo tanto em abas claras quanto escuras do navegador.

Posso converter SVG para ICO para usar como ícone de programa ou pasta no Windows?

Sim, o mesmo arquivo serve. O Windows usa a imagem de 256 px nas visualizações grandes e extragrandes do Explorador e as entradas menores nas listas e na barra de tarefas.

Por que meu ícone parece vazio em 16 px?

Traços finos e textos pequenos desaparecem nesse tamanho. Um traço de 2 unidades em uma prancheta de 512 unidades fica bem abaixo de um pixel em um ícone de 16 px. Engrosse as linhas ou use um símbolo mais simples para o favicon.

Converter SVG para ICO

Conversor de imagens