Otimizador de SVG
SVG Optimiser
Remove sobras de editor, achata transformações e arredonda a precisão dos caminhos, mostrando a diferença renderizada.
Um SVG salvo de uma ferramenta de design carrega metadados do editor, listas de transformação que ninguém desfez e coordenadas escritas com sete casas decimais. Remover tudo isso é fácil; saber se mudou a imagem é a parte difícil, e é por isso que isto mostra uma visão de diferença em vez de só uma contagem de bytes.
Solte um SVG
Ou edite a marcação abaixo. Nada é enviado.
Editar a marcação
Como usar
Solte o SVG, ou cole o código
Ele otimiza enquanto você digita, então tanto colar um arquivo quanto editá-lo no lugar funcionam.
Defina a precisão
Em um viewBox de 24 unidades, duas casas decimais são um centésimo de pixel a 100× de zoom. Abaixo de uma casa, os ícones começam a se deslocar visivelmente.
Confira a visão de diferença
Ela mistura o arquivo otimizado sobre o original em modo diferença: preto puro significa que renderizam de forma idêntica, e qualquer coisa que se acende é um pixel que se moveu.
Copie o SVG ou o data URI
O data URI aqui é codificado como URL e não em Base64, o que dá cerca de 10% sobre o arquivo cru em vez de 33%.
Perguntas frequentes
Por que “remover títulos” está desligado por padrão?
Porque `<title>` é o nome acessível de um SVG inline. Removê-lo economiza uns trinta bytes e transforma um ícone rotulado em um sem rótulo para quem usa um leitor de tela.
O meu ícone se deslocou um pouco depois de otimizar.
A precisão está baixa demais para o viewBox dele. Um viewBox pequeno significa que cada unidade é uma fração grande da imagem, então arredondar para uma casa decimal move as coisas visivelmente. Aumente a precisão até a visão de diferença ficar preta.
Ele minifica os dados dos caminhos?
Ele arredonda os números e incorpora uma translação pura neles, e informa quantos bytes isso economizou. Não reescreve comandos em equivalentes mais curtos: isso muda a família da curva e é onde os otimizadores de caminho introduzem bugs de verdade.
Pode receber de
Gerador de favicon
Favicon Generator
Produz o conjunto completo de favicons — ICO, PNGs, ícone Apple touch, manifesto web — mais o HTML para colar.
SVG para PNG
SVG to PNG
Renderiza um SVG em PNG, JPEG ou WebP em qualquer fator de escala, com fundo transparente ou preenchido.
Imagem para SVG
Image to SVG
Vetoriza um bitmap em caminhos SVG, afinado para logotipos e desenhos de linha, não para fotografias.
Gerador de QR code
QR Code Generator
Cria um QR para URL, texto, wifi, vCard ou string de pagamento, com correção de erro, logotipo e exportação em SVG.
Em seguida
Estas aceitam o que esta ferramenta produz, então o resultado pode ir direto.
Gerador de favicon
Favicon Generator
Produz o conjunto completo de favicons — ICO, PNGs, ícone Apple touch, manifesto web — mais o HTML para colar.
SVG para data URI de CSS
SVG to CSS Data URI
Codifica um SVG como data URI de background CSS, escapando só o que precisa para mantê-lo pequeno.
Editor de caminhos SVG
SVG Path Editor
Converte dados de caminho entre comandos absolutos e relativos, move, escala, gira e inverte, e mostra a bounding box com prévia ao vivo.
SVG para PNG
SVG to PNG
Renderiza um SVG em PNG, JPEG ou WebP em qualquer fator de escala, com fundo transparente ou preenchido.
Remover fundo de imagem
Background Remover
Recorta um fundo liso ou de cor única em OKLab e devolve um PNG transparente, com um pincel para corrigir as bordas.
Remover EXIF
EXIF Remover
Remove metadados de câmera, GPS e edição das fotos sem tocar nos pixels.