Compressor de animações SVG

• Compressão de animações SVG instantânea no navegador: comprima animações SVG instantaneamente no seu navegador, sem upload para servidor, sem processamento na nuvem e sem espera. O compressor de animações SVG remove metadados do editor, elimina animações SMIL sem efeito e otimiza os dados de traçado em milissegundos, tudo no seu dispositivo.
• Compressor de animações SVG online seguro: seu SVG nunca sai do seu dispositivo. O compressor de animações SVG roda inteiramente no seu navegador: sem upload para servidores, sem transmissão de dados e 100% privado. Seguro para animações de interface proprietárias, recursos de marca e arquivos SVG de produção.
• 9 opções de compressão configuráveis: o compressor de animações SVG oferece nove otimizações que podem ser ativadas individualmente, desde remover dados de editor do Inkscape/Illustrator até eliminar animações SMIL sem efeito e otimizar a precisão das coordenadas de traçado. Ative apenas as transformações de que precisa.
• 100% grátis para sempre: o compressor de animações SVG é totalmente gratuito, sem cadastro, sem plano premium, sem limites de tamanho de arquivo e sem anúncios. Comprima animações SVG ilimitadas a custo zero, para sempre.

• Otimização de desempenho web: comprima animações SVG exportadas do Inkscape, Illustrator ou Figma antes de incorporá-las em páginas web: SVGs exportados por editores contêm kilobytes de metadados invisíveis aos usuários que inflam o tamanho do arquivo. O compressor de animações SVG geralmente alcança redução de 40 a 70% em SVGs animados exportados por editores.
• Otimização de componentes SVG no React e Next.js: comprima animações SVG antes de convertê-las em componentes React com SVGR: SVGs menores produzem componentes React menores e reduzem o tamanho do bundle JavaScript. O compressor de animações SVG remove namespaces de editor que causam problemas de análise no SVGR.
• Otimização de animações para web móvel: reduza o tamanho de animações SVG para entrega em web móvel: SVGs menores são analisados mais rápido em CPUs móveis e reduzem o consumo de dados em redes 3G/4G. O compressor de animações SVG remove animações SMIL sem efeito que consomem CPU sem produzir efeitos visíveis.
• Preparação de animações para Lottie e GSAP: comprima arquivos SVG de origem antes de importá-los em fluxos de animação do Lottie ou GSAP: SVGs mais limpos com dados de traçado otimizados produzem importações de animação mais precisas e arquivos de saída menores. O compressor de animações SVG remove artefatos do editor que confundem as ferramentas de animação.
• Otimização de recursos SVG de design systems: comprima ícones e ilustrações SVG animados antes de publicá-los em um design system ou pacote npm: o compressor de animações SVG remove metadados do Figma, Sketch e Illustrator que inflam o tamanho dos arquivos SVG sem afetar a renderização.
• Otimização de Core Web Vitals e PageSpeed: reduza o tamanho das animações SVG para melhorar as pontuações de Largest Contentful Paint (LCP) e Total Blocking Time (TBT): SVGs inline grandes atrasam a renderização. O compressor de animações SVG ajuda você a cumprir a recomendação "Codifique imagens com eficiência" do Google PageSpeed para recursos SVG.

Arquivos SVG (Scalable Vector Graphics) exportados de ferramentas de design como Inkscape, Adobe Illustrator e Figma contêm grande quantidade de metadados do editor (declarações de namespace, propriedades do documento, nomes de camadas e atributos específicos da ferramenta) que são invisíveis aos usuários, mas inflam significativamente o tamanho do arquivo. SVGs com animações SMIL (usando <animate>, <animateTransform> e <animateMotion>) frequentemente contêm keyframes redundantes em que os valores from e to são idênticos: não produzem animação visível, mas consomem bytes e CPU. Nosso compressor de animações SVG aplica nove otimizações configuráveis para reduzir o tamanho do arquivo SVG preservando todas as animações visíveis e a renderização.

1. 1. Cole seu código SVG: insira seu SVG no painel de entrada ou clique em "Enviar .svg" para carregar um arquivo. Use "Carregar exemplo" para testar o compressor com um SVG animado realista exportado do Inkscape.
2. 2. Escolha as opções de compressão e clique em "Comprimir SVG": as nove otimizações são ativadas por padrão. O compressor aplica cada transformação em sequência e mostra comentários removidos, elementos removidos e traçados otimizados. O processamento roda inteiramente no seu navegador: seu SVG nunca sai do seu dispositivo.
3. 3. Copie ou baixe o SVG comprimido: o painel de saída mostra o código SVG comprimido. Copie para a área de transferência ou baixe como arquivo .svg. Substitua o SVG original no seu projeto: a saída comprimida é renderizada de forma idêntica em todos os navegadores.

• Metadados do editor: os atributos de namespace do Inkscape (inkscape:*, sodipodi:*), do Illustrator (i:*) e do Sketch (sketch:*) são removidos: eles podem representar de 20 a 50% do tamanho de um SVG exportado.
• Animações SMIL sem efeito: elementos <animate> em que from é igual a to não produzem animação visível: são removidos por completo. Costumam aparecer em SVGs exportados por ferramentas que adicionam stubs de animação a todos os elementos.
• Precisão das coordenadas de traçado: as coordenadas dos dados de traçado com mais de 2 casas decimais são arredondadas (por exemplo, M 10.123456789 20.987654321 vira M 10.12 20.99). A precisão subpixel além de 2 casas decimais é imperceptível em qualquer tamanho de tela.
• Valores de atributos padrão: atributos como opacity="1", stroke="none", fill-opacity="1" e display="inline" são padrões do SVG e são removidos: adicionam bytes sem alterar a renderização.

O compressor de animações SVG aplica transformações seguras e conservadoras usando processamento baseado em expressões regulares. Ele não analisa o DOM do SVG, então estruturas aninhadas complexas podem não ser totalmente otimizadas. Para compressão máxima, use o compressor de animações SVG como primeira passada e depois passe a saída pelo SVGO (um otimizador de SVG baseado em Node.js) para economia adicional. Sempre verifique se o SVG comprimido é renderizado corretamente nos seus navegadores de destino antes de publicar em produção, especialmente em animações SMIL complexas com interações CSS.