Ferramentas SVG
Execução manual. Ctrl/Cmd+Enter prepara a otimização. Mudar a entrada ou as opções invalida o resultado anterior.
O conteúdo SVG é processado somente neste navegador.
O resultado está desatualizado. Gere outra prévia.
Um arquivo exportado pelo editor pode trazer comentários e metadados que você não precisa publicar. Este otimizador SVG prepara uma proposta sem substituir a entrada: confira o desenho, os bytes e os caminhos antes de aceitar.
Minificar SVG compacta a apresentação do código SVG. Formatar faz o caminho inverso, com recuo de dois espaços para facilitar a leitura. Para otimizar SVG com arredondamento ou mudanças nos caminhos, habilite essas opções separadamente.
Um arquivo menor precisa manter as formas e referências importantes.
O otimizador SVG mantém ID, viewBox, title e desc. Arredondamento de números e otimização de caminhos começam desligados. Ao habilitá-los, compare curvas, cantos e traços finos: uma diferença pequena nas coordenadas pode aparecer em um ícone.
A lista de caminhos mostra os dados d dos elementos path. Na exportação PNG, escolha a largura em pixels; a altura acompanha a proporção do documento. O fundo permanece transparente para que o ícone possa ser usado sobre outras cores.
Remover comentários e metadados já vem ativado. Números e caminhos só são otimizados se você marcar as opções; a precisão inicial é de três casas decimais.
A prévia mostra bytes antes e depois, nós removidos e atributos alterados. Esses números ajudam, mas não representam todas as mudanças de formatação ou geometria. Compare também as duas imagens.
Mudar a fonte ou os parâmetros exige uma nova execução. Aplicar substitui a entrada; desfazer recupera de uma vez a entrada e a saída anteriores.
A execução usa operações selecionadas do SVGO. Comentários, metadados, números e caminhos têm controles próprios; um conjunto agressivo de transformações não é ativado automaticamente.
Original e proposta são exibidos como imagens isoladas depois da validação. Isso facilita conferir a aparência, mas o desenho também deve ser testado no contexto em que será inserido.
A lista exibe os valores d e a quantidade de path. Serve para encontrar a geometria na fonte, sem transformar a página em um editor com pontos de controle arrastáveis.
Copie ou baixe o SVG atual confirmado. Quando o destino exigir pixels, exporte PNG transparente com largura definida, sem precisar mudar manualmente a altura para manter a proporção.
O otimizador SVG continua produzindo vetores, mas arredondar números e reescrever caminhos pode mudar contornos. Por isso, essas opções começam desligadas. Já o PNG tem resolução fixa: escolha uma largura adequada ao tamanho em que será exibido.
Formatar acrescenta recuos e quebras de linha. Um SVG que já está compacto também pode oferecer pouca economia. Compare a contagem de bytes da proposta com a original antes de aplicar.
Não. O fluxo trabalha com um documento e uma comparação por vez, com uma etapa disponível para desfazer. Coleções de arquivos são mais adequadas a uma rotina de construção com validações próprias.
Animações e elementos style são recusados antes da prévia. Só há suporte a uma lista limitada de propriedades de apresentação em atributos style. Prepare documentos mais complexos no programa de origem antes de trazê-los para cá.
Não: os IDs são preservados e não há opção para removê-los. Isso ajuda a manter referências do projeto, mas scripts dentro do SVG são recusados. Confira as dependências externas ao integrar o resultado à aplicação.
Ficou alguma dúvida?
Abra o exemplo no otimizador SVG, compare a proposta e aplique apenas quando o resultado estiver adequado.
É possível desfazer uma aplicação de alterações.