Conversor de SVG para PNG, JPG e WebP

O que esta ferramenta faz

Um SVG é um desenho descrito em texto: formas, caminhos e cores em vez de pixels. Por isso ele fica nítido em qualquer tamanho, e também por isso muitos lugares não o aceitam. Redes sociais, clientes de e-mail, apresentações, lojas de aplicativos e quase todos os formulários de envio pedem PNG, JPG ou WebP. Esta ferramenta desenha o seu SVG no tamanho em pixels que você escolher e salva em um desses três formatos.

Tudo acontece no seu navegador. O arquivo é lido no seu dispositivo, desenhado em um canvas e codificado ali mesmo, então nada é enviado e não há fila.

Como converter um SVG

1. Solte o arquivo na caixa, escolha-o ou cole o código SVG no campo de texto. O botão "Testar um exemplo" carrega um ícone pequeno para você ver o resultado na hora.
2. Escolha o formato. PNG não perde qualidade e mantém a transparência, WebP é menor e também mantém, JPG é o menor para fotografias, mas não tem transparência alguma.
3. Escolha o tamanho e baixe. A pré-visualização muda a cada ajuste, e a linha abaixo mostra o tamanho em pixels e o peso do arquivo que você vai receber.

Escolhendo o tamanho

Um SVG não tem pixels próprios, então o tamanho é você quem define. Há três jeitos: uma escala (vezes o tamanho natural), uma largura exata ou uma altura exata. Com largura ou altura, o outro lado acompanha a proporção, e a imagem nunca fica esticada.

O tamanho natural vem do arquivo. Se o elemento raiz tem width e height, eles são usados. Se tem só o viewBox, algo comum em ícones, o viewBox dá o tamanho e a proporção: um ícone com viewBox="0 0 24 24" tem 24 por 24 pixels na escala 1, 96 por 96 na escala 4 e 512 por 512 quando você pede largura 512. Um logotipo largo com viewBox="0 0 24 12" na largura 480 sai com 480 por 240. Se o arquivo não tem tamanho nem viewBox, a ferramenta presume 300 por 150, como os navegadores, e avisa.

O lado mais longo pode ter até 8192 pixels e a imagem inteira cerca de 50 milhões de pixels, o que um navegador consegue desenhar com segurança.

PNG, JPG ou WebP

• PNG para logotipos, ícones e tudo com bordas nítidas ou transparência. Os arquivos são maiores, mas nada se perde.
• WebP para os mesmos casos quando o destino aceita: costuma ser bem menor que o PNG e mantém a transparência. O controle de qualidade vale.
• JPG só quando o destino exige. Não tem transparência, então a ferramenta sempre preenche o fundo com uma cor (branco por padrão) e o controle de qualidade vale. Bordas duras e cores chapadas mostram um leve ruído em blocos com qualidade baixa.

Para fundo transparente, deixe a chave "Fundo transparente" ligada e escolha PNG ou WebP. Desligue para preencher a imagem com a cor que quiser.

O que acontece com scripts e links

Um SVG não é só uma imagem: o formato permite scripts, manipuladores de eventos e links para outros arquivos. Um SVG de origem desconhecida deve ser tratado como qualquer arquivo em que você não confia. Aqui o arquivo é carregado apenas como imagem, algo que o navegador nunca deixa executar código, e antes disso a ferramenta remove elementos script, quadros incorporados, atributos de evento como onclick, links para outros endereços web e importações de CSS. A contagem é mostrada e nada é executado.

Quando o resultado parece errado

• O texto muda de fonte. Um SVG desenhado como imagem não carrega fontes da web. Converta o texto em curvas no seu programa de desenho ou incorpore a fonte.
• A imagem sai em branco. Confira se o código está completo e se o elemento raiz é svg. Código colado sem xmlns é corrigido sozinho, mas uma tag sem fechar não.
• Falta uma imagem externa. Imagens que apontam para outros endereços web são removidas de propósito. Incorpore-as como dados no arquivo.
• As bordas ficam suaves. Aumente o tamanho. Ampliar um SVG não perde qualidade; ampliar o PNG exportado, sim.