Conversor de SVG para PNG (também converte para JPG)

Converta gratuitamente um arquivo SVG ou um código SVG colado diretamente em uma imagem PNG ou JPG. Escolha exatamente o tamanho de saída que você precisa — tudo é processado dentro do seu próprio navegador.

PNG ou JPG? Como escolher o formato certo

Formato	Características	Recomendado para
PNG	Compressão sem perdas, então a qualidade não é reduzida, e mantém o fundo transparente intacto.	Logotipos, ícones e ilustrações que precisam de transparência ou bordas bem nítidas
JPG	Compressão com perdas que mantém o tamanho do arquivo pequeno, mas as áreas transparentes são preenchidas com a cor de fundo que você escolher.	Imagens com fundo fotográfico, ou quando reduzir o tamanho do arquivo é a prioridade principal

O SVG que você enviar ou colar nunca é enviado a um servidor: toda a conversão acontece dentro do seu próprio navegador.

O que é o conversor de SVG para PNG?

O conversor de SVG para PNG permite transformar um arquivo SVG (uma imagem vetorial) ou um código SVG colado diretamente em uma imagem PNG ou JPG, no tamanho em pixels que você escolher. O formato SVG é amplamente usado para ícones, logotipos e ilustrações justamente por permanecer nítido em qualquer escala, mas existem muitas situações — como enviar uma imagem para um formulário na web, ou exibi-la em um aplicativo ou em um ambiente mais antigo que não oferece suporte a SVG — em que, em vez disso, você precisa de um formato de imagem convencional. Esta ferramenta resolve essa diferença em poucos segundos, sem exigir a instalação de nenhum programa.

Toda a conversão é executada totalmente no lado do cliente, ou seja, dentro do seu próprio navegador, usando a API Canvas já incorporada nele, de modo que o seu arquivo ou código SVG nunca chega a ser enviado para um servidor. Como o SVG é um formato vetorial por natureza, alguém precisa decidir em algum momento qual será o tamanho em pixels usado na exportação; esta ferramenta detecta automaticamente um valor inicial sensato a partir do próprio SVG e, além disso, permite que você o ajuste livremente conforme a sua necessidade.

Como usar

Carregue o seu SVG Escolha um arquivo (também é possível arrastar e soltar) ou cole o código SVG diretamente no campo indicado.
Escolha o formato de saída Selecione PNG (mantém a transparência) ou JPG (preenche a transparência com uma cor de fundo).
Ajuste o tamanho de saída Digite a largura e a altura diretamente, ou use os botões de escala (1x/2x/4x) para alterar ambas de uma só vez.
Converta e baixe Clique em "Converter" para ver uma pré-visualização e baixe o resultado imediatamente.

Dicas para aproveitar melhor

Se o seu SVG não tiver atributos de width/height nem um viewBox, o tamanho inicial de saída será 512×512px por padrão. Você pode alterá-lo livremente para o tamanho que precisar.
Os botões de escala (1x/2x/4x) multiplicam de uma só vez o tamanho detectado no seu SVG, o que é muito útil para exportar conjuntos de ícones em 2x/4x voltados para telas Retina (de alta densidade de pixels).
Escolha PNG se precisar manter um fundo transparente. O JPG não tem canal alfa, então qualquer área transparente será preenchida com a cor de fundo que você escolher (branco por padrão).
Gradientes complexos e efeitos de filtro presentes no seu SVG são renderizados exatamente como o seu navegador os interpreta no momento. Se o SVG fizer referência a fontes ou imagens externas, elas só serão exibidas corretamente se o navegador conseguir carregá-las sem problemas.
Mantenha a opção "Bloquear proporção" marcada para alterar a largura ou a altura preservando as proporções originais do design. Desmarque-a se quiser definir a largura e a altura de forma totalmente independente.

Casos de uso

Rasterizar ícones e logotipos

Converta para PNG um ícone SVG exportado de uma ferramenta de design antes de incorporá-lo a um sistema ou aplicativo que não suporte SVG.

Enviar arquivos para formulários na web

Muitos formulários e serviços online não aceitam envio de arquivos SVG: converta para PNG/JPG antecipadamente para contornar esse problema.

Exportar vários tamanhos para telas Retina

Use os botões de escala para gerar rapidamente versões em 1x/2x/4x voltadas para um conjunto de ícones de alta densidade de pixels.

Colar em redes sociais ou apresentações

Converta para um formato de imagem convencional, adequado a plataformas e apresentações de slides que não aceitam um SVG diretamente.

Glossário

SVG (Scalable Vector Graphics): Um formato de imagem vetorial que descreve formas por meio de coordenadas e traçados escritos em texto XML. Nunca apresenta aspecto serrilhado ao ser ampliado ou reduzido.
Rasterizar: O processo de converter uma imagem vetorial em uma grade de pixels (uma imagem raster) com um tamanho específico.
viewBox: Um atributo do SVG que define o intervalo de coordenadas ocupado internamente pelo seu conteúdo. É usado como alternativa para as dimensões quando os atributos width/height estão ausentes.
Canal alfa: A informação de transparência armazenada para cada pixel de uma imagem. O PNG a preserva, enquanto o JPG não possui canal alfa, de modo que as áreas transparentes são preenchidas com uma cor de fundo na conversão.
Canvas API: A interface padrão de JavaScript do navegador para desenhar e manipular imagens. Esta ferramenta rasteriza o SVG usando apenas a Canvas API, sem exigir nenhuma biblioteca adicional.

Perguntas frequentes

Escolha PNG se precisar preservar a transparência ou quiser bordas bem nítidas, como costuma ser o caso de logotipos e ícones. Escolha JPG para imagens com fundo fotográfico em que reduzir o tamanho do arquivo é mais importante.

Se o arquivo SVG define atributos de width/height ou um viewBox, esse valor é usado como tamanho inicial. Se nenhum dos dois for encontrado, o padrão é 512×512px. A partir daí, você pode alterar o tamanho livremente.

Não. Toda a conversão é executada dentro do seu navegador usando JavaScript, e nada é enviado a um servidor externo em nenhum momento.

Não — como o SVG é um formato vetorial, as bordas permanecem perfeitamente suaves independentemente do tamanho em pixels escolhido para a exportação, ao contrário do que acontece ao ampliar uma imagem que já está em pixels.

Um SVG animado é exportado como um único quadro estático. SVGs que fazem referência a fontes ou imagens externas só são renderizados corretamente se o seu navegador conseguir carregar esses recursos externos no momento da conversão.

Curiosidade — um SVG é, no fundo, apenas um arquivo de texto escrito em XML

Diferente do PNG ou do JPG, que armazenam uma imagem como uma grade de pixels, o SVG (Scalable Vector Graphics, ou gráficos vetoriais escaláveis) descreve as formas por meio de coordenadas e traçados matemáticos escritos em texto XML. É por isso que ele pode ser ampliado ou reduzido sem nunca apresentar aquele aspecto serrilhado tão característico das imagens em pixels, e também é por isso que é possível abrir o arquivo em um simples editor de texto e ler diretamente o seu conteúdo. Essa maneira de construir a imagem é exatamente o motivo pelo qual o SVG se tornou o formato preferido para logotipos e ícones que precisam parecer nítidos em muitos tamanhos diferentes, do menor favicon ao maior banner.

O SVG não tem nenhuma noção inerente de "resolução" — ele é armazenado de forma puramente vetorial, como uma espécie de receita matemática para desenhar formas. Por isso, cada vez que você o transforma em um formato convencional baseado em pixels, como PNG ou JPG, alguém precisa decidir com quais dimensões em pixels o resultado será renderizado. É exatamente por essa razão que esta ferramenta permite que você especifique a largura e a altura: trata-se de uma consequência direta e inevitável da própria natureza do SVG, e não de uma limitação arbitrária desta página.

Na prática, existem muitos arquivos SVG reais que simplesmente não definem os atributos width e height, ou que os expressam em unidades relativas, como porcentagens, pensadas para se adaptar ao contêiner onde forem inseridos. Para esses casos, a convenção mais comum entre as ferramentas de conversão é recorrer ao atributo viewBox, que define o intervalo de coordenadas ocupado internamente pelo conteúdo do SVG. Esta ferramenta segue exatamente essa mesma convenção: quando os atributos width e height estão ausentes, ela usa o viewBox como um substituto razoável para calcular as dimensões em pixels do resultado final.

Ver todas as curiosidades