Converter SVG para PNG - Grátis, Qualquer Tamanho, no Navegador

Um SVG não é uma imagem: é um conjunto de instruções de desenho. É por isso que se mantém nítido em qualquer tamanho — as formas são recalculadas sempre que é apresentado. Transformá-lo num PNG executa essas instruções uma vez, num tamanho, e congela o resultado numa grelha de píxeis. Está a abdicar da principal vantagem do formato, por isso vale a pena perceber o que recebe em troca.

Como converter SVG para PNG

1. 1 Largue o ficheiro .svg na área de carregamento.
2. 2 Defina a largura de saída. Os botões 1x, 2x e 4x partem do tamanho escrito no ficheiro; se não existir, começamos nos 1024 píxeis.
3. 3 Clique em Converter e descarregue o PNG. As áreas transparentes continuam transparentes.

O tamanho que escolher passa a ser o teto

Esta é a única decisão verdadeira desta página. Um SVG não tem resolução original a que recorrer, por isso a largura que introduzir é o mais nítido que a imagem alguma vez será — amplie o PNG depois e fica desfocado, tal como qualquer outra imagem rasterizada. O hábito seguro é exportar ao dobro do tamanho de apresentação, o que cobre ecrãs de alta densidade, e guardar o próprio SVG para tudo o que possa vir a precisar maior. Se o ficheiro não trouxer largura própria, começamos nos 1024 píxeis: um valor por omissão razoável, não um original com significado.

Quando o PNG é mesmo necessário

Muitos sítios continuam a recusar SVG, geralmente com razão: um SVG pode transportar scripts, por isso sistemas que aceitam carregamentos de estranhos rejeitam-no muitas vezes de imediato. O caso mais comum são as imagens de pré-visualização social — og:image e os cartões do Twitter querem um raster. Para além disso: modelos de e-mail, fichas de lojas de aplicações e marketplaces, fluxos de impressão, ferramentas de design antigas, recursos de jogos e canvas, e tudo o que precise de um tamanho fixo em píxeis para compor à volta. Em todos eles a limitação está no lado de quem recebe, não no seu ficheiro.

As fontes e os ficheiros ligados não vêm juntos

Por segurança, os navegadores desenham um SVG numa caixa de areia: não corre nenhum script e não são carregados recursos externos. É o comportamento correto, mas aqui tem uma consequência visível. Se o seu SVG referencia um tipo de letra da web, o texto recai num tipo de letra do sistema e as formas deslocam-se. Se liga a uma imagem externa, essa imagem simplesmente não aparece. Se dependia do CSS da página envolvente, esse estilo desaparece. A solução é tornar o ficheiro autónomo antes de converter — passe o texto a contornos e incorpore as imagens. É também o que se pretende antes de entregar um SVG a alguém.