Otimize um SVG no seu navegador e copie-o como arquivo otimizado, como data URI ou como plano de fundo CSS — com tecnologia SVGO e sem nenhum envio. Solte ou cole um ícone, ajuste as configurações e obtenha a menor forma inline para CSS, HTML ou o seu design system.
Como funciona
A ferramenta carrega o SVGO — o otimizador de SVG padrão, o mesmo motor por trás do SVGOMG — uma única vez de uma CDN pública e, depois, é executada inteiramente no seu dispositivo. Ela remove metadados do editor, comentários e dados redundantes, e arredonda as coordenadas para uma precisão à sua escolha. O código otimizado é então oferecido em quatro formas prontas para uso, lado a lado com uma prévia ao vivo e o tamanho antes/depois.
Passos
- Solte um arquivo
.svgna área de upload ou cole o seu código SVG na caixa de origem. - Ajuste as opções de otimização — reduza a Precisão para arquivos menores ou mantenha os padrões seguros.
- Observe a prévia e a redução de tamanho serem atualizadas ao vivo.
- Copie a forma de que você precisa (SVG, data URI ou CSS) ou baixe o
.svgotimizado.
Formas de saída — qual copiar
Quando usar codificado em URL ou Base64
O SVG é texto, e o Base64 aumenta o texto em cerca de um terço. Para SVG especificamente, o data URI codificado em URL é menor e igualmente válido em CSS e HTML, então é a escolha padrão para um plano de fundo CSS. Recorra ao Base64 apenas quando uma ferramenta de build ou plataforma corromper os caracteres reservados em um URI codificado em URL.
Configurações de otimização
Exemplo
Um ícone de 2,1 KB exportado de uma ferramenta de design — cheio de metadados do editor, comentários e coordenadas com 6 casas decimais — normalmente cai para bem abaixo de 1 KB com os padrões, e depois para uma string inline data:image/svg+xml,... que você pode colar diretamente em uma regra CSS sem requisição extra.
Privado por design
Seu SVG nunca sai do seu navegador. Da CDN é buscado apenas o código do SVGO (uma vez, depois em cache); o markup que você cola ou solta é otimizado localmente, então é seguro para ícones internos e ativos de marca ainda não lançados.
