Otimizador de SVG
Limpe o markup vetorial antes que ele entre em um componente, conjunto de ícones ou pacote de assets estáticos.
Configurações de otimização
Precisão menor pode encolher mais o arquivo, mas arredondamento agressivo pode deformar paths. Um valor de 2 ou 3 costuma ser um bom padrão.
Como a otimização de SVG funciona
Remover dados que não renderizam
Exports de ferramentas de design costumam incluir metadados, comentários, namespaces de editor e markup invisível que adiciona bytes sem mudar a imagem renderizada.
Reduzir precisão de paths
Coordenadas como 10.5432109 muitas vezes podem virar 10.54 sem diferença visível, especialmente em ícones renderizados em tamanhos pequenos.
Inspecionar antes de publicar
A otimização deve manter viewBox, fills, strokes, labels ARIA e IDs importantes quando eles afetam renderização, estilo, animação ou acessibilidade.
Perguntas frequentes
O SVG otimizado vai ficar borrado?
Não. SVG é vetorial, então a otimização corta markup em vez de rasterizar a imagem. O risco é apenas arredondar valores de path de forma agressiva demais.
Por que um SVG otimizado às vezes fica maior?
Se o arquivo original já estava bem comprimido ou otimizado manualmente, pode haver pouco a remover. Nesses casos, a saída pode ter tamanho parecido ou ocasionalmente um pouco maior.
Isso aceita otimização em lote?
Esta página foi pensada para inspeção e ajuste de arquivo único. Para otimização em lote, use uma ferramenta de build como SVGO no pipeline.
Otimização de SVG pode quebrar animações ou estilos?
Sim, se um otimizador remover IDs, classes, metadados ou precisão usados pelo seu CSS ou JavaScript. Pré-visualize o resultado e mantenha atributos importantes quando o SVG for interativo.
SVGs decorativos devem ter labels de acessibilidade?
SVGs decorativos normalmente podem ser ocultados de tecnologias assistivas. Ícones e ilustrações informativas devem manter títulos, labels ou texto ao redor com significado.