O que é SVG? Um guia da linguagem para o formato vetorial
O que é SVG? Como funciona a imagem vetorial SVG, como ela difere de PNG e JPG, vantagens e limites, usos comuns e como abrir e editar arquivos SVG.
1. O que é SVG?
SVG significa Scalable Vector Graphics, um formato aberto de gráficos vetoriais baseado em XML e padronizado pelo W3C. Enquanto PNG e JPG registram uma imagem como uma grade de pixels, o SVG usa fórmulas matemáticas para descrever formas: uma reta, um círculo, uma curva de Bézier — cada uma gravada no arquivo como coordenadas e comandos de caminho.
É exatamente por isso que um SVG nunca fica desfocado quando ampliado: o navegador apenas redesenha as fórmulas no novo tamanho em vez de esticar pixels. É esse o significado da palavra "vetor".
2. SVG x PNG / JPG
| Aspecto | SVG | PNG / JPG |
|---|---|---|
| Como guarda a imagem | Caminhos matemáticos (vetor) | Grades de pixels (bitmap) |
| Ao ampliar | Escala sem limites e sem distorção | Apresenta serrilhado e desfoque |
| Tamanho do arquivo | Mínimo para gráficos simples (poucos KB) | Cresce de forma linear com a resolução |
| Editabilidade | Texto que pode ser editado, colorido e animado | Exige programa de edição de imagens |
| Melhor para | Ícones, logotipos, ilustrações, gráficos | Fotos e iluminação complexa |
3. Para que o SVG é usado
- Ícones e logotipos de sites: um único SVG serve a todas as densidades de tela e continua nítido em telas Retina;
- Ilustrações e gráficos: bibliotecas de visualização de dados como ECharts e Recharts geram SVG por padrão;
- Impressão e gravação: gravadoras a laser, plotadoras de recorte e impressoras UV aceitam caminhos SVG;
- Animação: os caminhos SVG podem ser acionados diretamente por CSS / SMIL / JavaScript, o que viabiliza efeitos de traço desenhado e muito mais.
4. Como abrir e editar um SVG?
Qualquer navegador moderno (Chrome / Edge / Firefox / Safari) abre arquivos SVG diretamente, e programas de design como Illustrator, Figma e Inkscape (gratuito) conseguem editá-los. Se você só quer trocar uma cor, remover um fundo ou apagar parte do desenho, use o editor SVG online da PolySVG, sem instalar programa nenhum.
5. Como transformar meu PNG / JPG em SVG?
Use a ferramenta Imagem para SVG da PolySVG: envie o bitmap e o modelo próprio faz automaticamente a quantização de cores, o rastreamento de contornos e o ajuste das curvas, entregando um SVG editável em poucos segundos, com remoção de fundo em um clique. Todo o processo é gratuito e não exige cadastro.
Resumo: o SVG é um formato que "desenha com fórmulas", por isso se adapta naturalmente a ícones, logotipos e a tudo o que precisa ser redimensionado; para conteúdo fotográfico, JPG / WEBP continuam sendo melhores.
Perguntas frequentes
Qual programa abre arquivos SVG?
Qualquer navegador moderno abre e pré-visualiza diretamente. Para editar, use Illustrator, Figma ou Inkscape, ou resolva tudo no editor online da PolySVG sem instalar nada.
Um SVG pode ser convertido em PNG?
Sim. O editor da PolySVG exporta SVG para PNG em qualquer resolução, e uma captura de tela do navegador ou a exportação de um programa de design fazem o mesmo.