Conversor de SVG para PNG

O que é um SVG, e por que rasterizar só vai num sentido

Um SVG não é uma imagem. É a descrição de uma — uma lista de formas, traçados, cores e texto, cada um com suas coordenadas, escrita num arquivo de texto que alguma outra coisa lê e desenha. Um JPG ou um PNG é o contrário: uma grade de pixels, decidida de uma vez quando o arquivo foi gravado. Essa única diferença está por trás de tudo o que há nesta página, inclusive da única pergunta que este conversor precisa fazer a você e que os outros dois conversores nunca fazem.

• É texto que você consegue ler. Abra um SVG em qualquer editor de texto e as formas estão escritas ali diante de você — que é também como você mesmo pode conferir qual tamanho o arquivo diz ter e para o que ele aponta.
• Ele não tem resolução nenhuma. O mesmo arquivo é um ícone nítido do tamanho de um ponto final e um cartaz nítido numa parede, porque o desenho é refeito do zero por aquilo que o estiver exibindo, em vez de ficar armazenado em algum lugar.
• Aquilo em que ele é bom é arte plana — logotipos, ícones, diagramas, gráficos, mapas, qualquer coisa desenhada em vez de fotografada. Aquilo em que ele é péssimo é uma fotografia, que não tem formas a descrever e precisaria de uma linha do arquivo por pixel.
• Rasterizar um deles é o que esta página faz, e o motivo é quase sempre algum lugar que não aceita o formato: um formulário de envio, um editor de imagens antigo, um modelo de documento ou de slide, uma prévia de rede social, um e-mail, um serviço de impressão.

Transformá-lo num PNG fixa o desenho em pixels num tamanho escolhido, e essa é uma porta que só abre para um lado. As formas não ficam guardadas no resultado e nenhum ajuste daqui as mantém, então ampliar o PNG depois amplia os pixels dele em vez de redesenhar coisa alguma, e esta página não grava formato vetorial nenhum — transformar uma imagem de volta em formas é um problema diferente, com respostas diferentes, e não o inverso deste. Por isso, guarde o SVG. O que você baixa aqui é uma cópia feita para um propósito e um tamanho, e o jeito de obter um segundo tamanho é converter o original de novo, e não redimensionar o que você já tem.

De onde veio o tamanho que está nos campos

Como um vetor não tem pixels próprios, alguma coisa precisa decidir com quantos ele sai, e esta página começa lendo o que o próprio arquivo dá a entender. Esse número vai para os campos de largura e altura, e uma frase ao lado deles identifica o arquivo pelo nome e diz de qual de exatamente três lugares o número foi tirado. Vale ler antes de converter, porque os três não são igualmente confiáveis e só você sabe qual deles era o que você queria.

• O arquivo declara um tamanho próprio, em pixels. Este é o mais forte dos três: alguém que exportou o desenho disse que tamanho ele deveria ter, e os campos apenas repetem isso.
• O arquivo declara o tamanho em unidades físicas — polegadas, centímetros, milímetros, pontos ou paicas — e ele foi convertido a noventa e seis pixels por polegada, que é o que a web entende por uma polegada e não uma medida da sua tela. Um desenho preparado para impressão costuma chegar assim, e o tamanho em pixels que sai disso é uma conversão fiel de um número que nunca foi sobre pixels.
• O arquivo não declara tamanho utilizável nenhum, então o tamanho foi medido a partir do viewBox dele. Esse é o caso para olhar duas vezes: um viewBox é o sistema de coordenadas em que as formas são desenhadas, e não um tamanho que alguém escolheu, então um ícone cujas coordenadas vão de zero a vinte e quatro chega pedindo para ser uma imagem do tamanho de um ponto final. Conjuntos de ícones também costumam ser escritos com largura e altura em porcentagem, que é um tamanho relativo a algo que este arquivo não tem e é lido como nenhum tamanho, de modo que esses também vão parar aqui.

Qualquer dos três que tenha respondido, o número é arredondado para pixels inteiros uma vez, no momento em que é lido, porque um canvas é alocado em pixels inteiros e não há onde pôr uma fração. Isso importa para uma coisa em particular: todo o resto trabalha a partir do número arredondado que você vê, e não da fração por trás dele, então o dobro de um desenho exibido como tendo trinta e um pixels de largura é sessenta e dois, e não os sessenta e três que um segundo arredondamento produziria. O tamanho na tela e o tamanho que a aritmética usa são o mesmo tamanho, que é o único arranjo em que os campos significam o que dizem.

Escolher o tamanho de que você precisa — e o desenho que não declara nenhum

O tamanho que o arquivo dá a entender é sempre apenas um ponto de partida, e é oferecido como tal em vez de imposto. Tudo nos dois campos está arranjado de modo que o caso comum não exija pensar e o caso exato continue disponível, o que é toda a diferença entre esta página e as duas páginas irmãs dela — uma fotografia é convertida no tamanho que já tem, e não há nada a decidir.

• Digite uma largura e a altura acompanha; digite uma altura e a largura acompanha, de modo que o desenho mantém as proporções sem que você tenha de calcular nada. Esse é o padrão porque distorcer um logotipo sem querer é o erro que vale a pena tornar impossível.
• Desmarque a opção que mantém as proporções quando você realmente precisar de uma caixa exata — um espaço de banner, um avatar de tamanho fixo, uma folha de ícones — e os dois campos ficam independentes. O desenho passa então a ser esticado para preencher aquilo que você pediu, que é o que você queria e é também o motivo de isso ser um ato deliberado em vez do padrão.
• A fileira de multiplicadores é o caminho rápido para os tamanhos que as pessoas realmente querem, e cada um deles é medido em relação ao tamanho que o arquivo declara, e não em relação ao que estiver nos campos naquele momento. Assim, apertar o mesmo multiplicador duas vezes dá a você a mesma resposta duas vezes, em vez de acumular até algo que você não pediu.
• Um multiplicador que não tem resposta aparece como indisponível em vez de como um botão que não faz nada. Multiplicar um desenho que já é enorme pode chegar a um tamanho que nenhum formato de imagem consegue expressar, e um controle que recusasse em silêncio seria pior do que um que mostra a você que não consegue.

Depois há o arquivo que não declara nada: nenhuma largura e altura que esta ferramenta consiga ler, e também nenhum viewBox para medir. É mais comum do que parece — um desenho exportado direto de certos editores, ou um escrito à mão para uma página que ia dimensioná-lo com CSS. Realmente não há tamanho nenhum nele, então os campos abrem vazios, nenhuma frase aparece dizendo de onde veio um número, não há o que multiplicar nem proporção a manter, e a linha recusa e pede a você uma largura e uma altura. Essa recusa é justamente o objetivo, e não uma falha: um navegador que recebe um arquivo desses cai numa caixa pequena de tamanho fixo que ninguém escolheu, e ser perguntado uma vez é melhor do que baixar isso e descobrir depois.

Um par que não é um tamanho é recusado com uma explicação própria, que é a outra metade do mesmo cuidado. Zero, um número negativo, meio pixel ou um número maior do que qualquer formato de imagem consegue expressar são todos recusados, em vez de arredondados, limitados ou trocados em silêncio pelo tamanho do próprio arquivo — uma conversão num tamanho que ninguém pediu é exatamente o que esta página existe para não fazer. E se o que você escolheu é uma fotografia em vez de um desenho, os campos de tamanho não aparecem de jeito nenhum: uma imagem de pixels é convertida nas dimensões que já tem, e um controle que não pudesse mudar nada é pior do que controle nenhum.

Para qual formato rasterizar

Esta página abre em PNG porque essa é a resposta certa para quase todo vetor, e os outros formatos estão a um clique de distância, em vez de atrás de outra página. O que você está escolhendo é entre um formato que guarda os pixels exatamente e dois que trocam parte deles por um arquivo menor, e no caso de um desenho a evidência pende para um lado como em quase nenhum outro: cor lisa e bordas nítidas são justamente o conteúdo que a compressão com perdas trata pior.

• O PNG é o padrão e costuma encerrar a discussão. Ele guarda o desenho rasterizado exatamente, carrega transparência e comprime muito bem áreas lisas de uma cor só — que é o que um logotipo ou um ícone é em grande parte, então o arquivo muitas vezes fica menor do que a fama do formato sugere.
• O JPG só vale a pena quando alguma coisa do outro lado insiste nele. Ele não consegue guardar transparência nenhuma, então uma cor de fundo precisa ser pintada atrás do seu desenho antes, e a compressão dele deixa uma franja acinzentada justamente ao longo das bordas nítidas e das letras que você rasterizou o vetor para manter.
• O WebP é a resposta intermediária para uma página da web: ele carrega transparência e costuma ser menor do que o PNG. Aqui ele tem perdas em qualquer ajuste de qualidade, inclusive no topo do controle, então é uma boa escolha para uma imagem que vai para uma página e uma escolha ruim para uma cópia-mestra que você vai editar de novo.
• Nenhum dos três é um vetor, e esta página não grava formato vetorial nenhum. Se o que você precisa é de um arquivo que escale, o SVG que você já tem é ele — guarde-o, e trate o que quer que você baixe aqui como uma cópia feita para um lugar só.

O controle de qualidade aparece só para os dois formatos que têm algo a ceder, ou seja, JPG e WebP; o PNG não descarta nada, então nenhum controle é oferecido, em vez de um que ficasse ali sem fazer nada. Cada linha mostra o tamanho com que o arquivo saiu, de modo que a troca que você está fazendo é um número diante de você. Mover esse controle recodifica uma imagem que já foi desenhada, onde é possível, em vez de rasterizar o desenho de novo, ao passo que mudar o tamanho realmente obriga a desenhá-lo outra vez — que é a ordem certa, já que a segunda é a que de fato produz pixels diferentes.

O que uma rasterização não consegue levar adiante

Tudo aqui é feito com o maquinário de desenhar que já vem no seu navegador: o arquivo é entregue como uma imagem, desenhado uma vez no tamanho que você escolheu e gravado de volta no formato que você pediu. É isso que permite que a ferramenta funcione sem nada ser enviado, nada ser instalado e nada ser baixado além da própria página — e, para um vetor, é isso que também decide o que o resultado pode conter, porque um SVG é um documento e não um bloco de pixels, e um documento pode pedir coisas.

Entregue do jeito que é aqui, ele não as recebe. Nada de dentro do arquivo é executado e nada de fora do arquivo é buscado, o que é uma propriedade deliberada e genuinamente valiosa: um SVG pode carregar um script e pode carregar uma referência a um endereço em algum lugar que seria requisitado no instante em que o desenho fosse exibido. Abrir aqui o desenho de um desconhecido não faz nem uma coisa nem outra. O que essa segurança custa está exposto abaixo, e os dois primeiros itens são anunciados na linha em vez de ficarem para você notar.

• Qualquer coisa para a qual o arquivo aponte fora de si mesmo não vai carregar — uma imagem vinculada, uma folha de estilo, uma fonte. Isso vale para um endereço na web e vale igualmente para um arquivo que está na mesma pasta, que é de longe o caso mais comum e o motivo de o aviso dizer que as partes não vão carregar, em vez de dizer que elas eram remotas. Aquilo para que elas serviam fica faltando no resultado, e a correção é embutir essas partes no desenho e convertê-lo de novo.
• O texto é traçado com as fontes instaladas nesta máquina. As letras estão no resultado e parecem certas para você, mas o mesmo arquivo rasterizado em outro computador pode escolher outra fonte e sair como uma imagem diferente. Se as formas exatas importam, converta o texto em traçados no programa que desenhou o arquivo, e aí nada mais é procurado em lugar nenhum.
• Qualquer coisa que o desenho faça ao longo do tempo não está no resultado. A saída é uma imagem parada em todos os formatos oferecidos, então um arquivo que se anima contribui com o único instante que foi desenhado, e nada de interativo sobrevive à viagem tampouco.

Dois tetos do que sai daqui valem ser declarados com todas as letras, em vez de deixados para serem descobertos. O PNG é gravado pelo compressor do próprio navegador, que é decente e não exaustivo, então um otimizador dedicado ainda conseguiria tirar uma fatia do arquivo sem mudar um pixel dele; e o WebP é uma codificação com perdas em qualquer ajuste, porque não há como pedir a um navegador o modo sem perdas do formato. Os dois poderiam ser superados embarcando um codificador de verdade compilado para rodar dentro da página, e esta ferramenta deliberadamente não faz isso — são algumas centenas de kilobytes que todo visitante baixaria para que alguns deles ganhassem um arquivo um pouco menor, num site em que todas as outras páginas funcionam no instante em que são desenhadas. Nesta página em particular, isso também renderia menos do que parece: a rasterização é o desenho que o próprio navegador faz do seu vetor, e um codificador não consegue mudar como isso foi desenhado.

O que cada linha conta a você sobre o seu desenho, e quando ela recusa

Um conversor que trabalha em silêncio é o que faz alguém acabar com um logotipo sobre um fundo preto, ou com um desenho sem a imagem para a qual ele apontava, e descobrir isso dias depois e em outro lugar. Cada linha aqui traz um relato curto do que de fato foi feito com aquele arquivo — e não traz absolutamente nada quando nada digno de nota aconteceu, e é isso que faz valer a pena parar nos avisos. Um vetor encontra um conjunto de avisos diferente do de uma fotografia, e três dos avisos da ferramenta não podem se aplicar a ele de jeito nenhum: um desenho não tem dados de câmera a descartar, nada que diga de que lado fica o alto e nenhum quadro a perder.

• Alguma coisa para a qual o desenho aponta não vai carregar. Aparece para um arquivo que se refere a uma imagem, a uma folha de estilo ou a uma fonte que não está dentro dele, seja por um endereço, seja por um caminho ao lado dele, e é a explicação para um resultado que saiu com um pedaço faltando.
• O texto foi traçado com as fontes desta máquina. Aparece só onde o desenho realmente põe letras no canvas, então um arquivo com um elemento de texto vazio não diz nada, e um desenho sem texto nenhum também não diz nada.
• A transparência foi achatada, e sobre qual cor. Converter para JPG obriga a pôr alguma coisa atrás do desenho, e um controle de cor aparece assim que um arquivo da sua lista realmente precisa de um. Este aviso é medido e não presumido: ele espera até que um pixel de fato transparente tenha sido encontrado no que foi desenhado, então um desenho cuja própria arte cobre a imagem inteira é convertido para JPG sem dizer nada a respeito.
• O nome e o conteúdo discordam. O formato é decidido pelo conteúdo do arquivo e nunca pela extensão dele, então um desenho que alguém salvou com a terminação errada é lido e convertido corretamente como o SVG que ele é — e você é avisado, porque é uma coisa verdadeira sobre o seu arquivo que você provavelmente não sabia.
• O WebP neste ajuste continua com perdas. Rasterizar um desenho e então pedir o topo do controle de qualidade dá a sensação de que deveria voltar exatamente o que foi desenhado, e não volta — essa é a crença que o aviso existe para corrigir, e é por isso que ele aparece ali e em nenhuma posição mais baixa.

Quando um arquivo não pode ser convertido de jeito nenhum, a ferramenta diz por quê, em vez de produzir alguma coisa. Um arquivo que não é nenhum dos formatos que ela lê é identificado pelo nome e recusado, e o mesmo vale para um que é um formato aceito mas cujo começo não pode ser lido — para um desenho, isso quer dizer a tag de abertura dele, que é a única coisa que um vetor tem à guisa de cabeçalho. Um arquivo com um desenho em algum ponto dentro de uma página da web não é um arquivo de imagem e é recusado como tal, e o mesmo vale para um desenho que o seu navegador acaba não conseguindo desenhar, por mais íntegro que parecesse por fora. Nada é adivinhado, e nada meio pronto é devolvido como se estivesse terminado.

A recusa que você tem mais chance de encontrar aqui é a do tamanho, e isso é um fato sobre esta página e não sobre o seu arquivo: um multiplicador está a um clique, um desenho se deixa pedir qualquer tamanho de bom grado, e não há nada num vetor que segure você. Quem segura é o navegador, que só sustenta uma imagem até certa área — uma área diferente num celular e num computador de mesa, e diferente de novo entre dois navegadores da mesma máquina. Atravessá-la não produz erro algum, apenas uma imagem em branco de alguns kilobytes que parece uma conversão terminada até alguém abrir. Por isso esta ferramenta escreve um pixel conhecido na imagem no tamanho que você pediu e o lê de volta antes de uma única forma ser desenhada; se ele não voltar, você recebe a recusa com o tamanho dentro dela e nenhum arquivo. Em lugar nenhum se compara algo com um número fixo, então o teto em que você esbarra é o do seu próprio aparelho, e nunca um escolhido para outra pessoa.

Por que o seu desenho nunca sai desta aba

Um desenho entrega mais do que uma fotografia, porque um desenho é um arquivo de texto e dá para ler. Os nomes das camadas, o nome de quem o exportou, um comentário que alguém deixou dentro, o endereço de cada peça para a qual ele apontava: tudo isso está escrito por extenso no arquivo, e nada disso vai para lugar nenhum. O seu SVG é lido por esta aba do navegador e rasterizado pelo processador da sua própria máquina. Do outro lado desta página não existe servidor que pudesse aceitar um, então isto é uma descrição de como a ferramenta foi construída, e não uma promessa sobre como ela é operada.

Alguns segundos no painel de rede das ferramentas de desenvolvedor do navegador resolvem a questão, e no caso de um desenho há duas coisas para observar em vez de uma. Nada sai levando o seu arquivo, e nada sai em nome do arquivo tampouco, por mais endereços que estejam escritos dentro dele. Depois de carregada, a página é um punhado de arquivos estáticos sem código rodando em nenhum outro lugar, então você pode se desconectar por completo da rede e seguir rasterizando o quanto quiser.

• Um desenho que você não mandaria a um desconhecido — um logotipo ainda não anunciado, uma planta baixa, o diagrama de algo interno — pode ser rasterizado aqui sem sair da sua máquina.
• O que sai da rasterização fica nesta aba até você salvar, e fechar a aba é tudo o que apagar exige. Nem o desenho que você trouxe nem a imagem feita a partir dele é lembrado de uma visita para a outra.
• Um desenho que veio de um lugar em que você não confia inteiramente pode ser aberto aqui com segurança, porque nada dentro dele é executado e nada para o que ele aponta é buscado. Rasterizá-lo é também uma maneira de limpá-lo: o que você baixa são pixels, e pixels não conseguem pedir nada.