SVG Optimizer and MinifierSVGO optimization with visual checks
en

AppHelp

Optimize and minify SVG files with a visual diff

Paste or open an SVG, tune SVGO-backed cleanup options, compare original and optimized artwork, inspect byte and gzip savings, then copy or download the result. The file stays in your browser.

SVG optimization workspace

Tune structural cleanup, compare rendered artwork and markup, and check both raw and gzip size before replacing a production asset.

Optimized locally
1. SVG input
2. Optimization settings

The viewBox is always preserved. Use ID minification and structural changes only after testing CSS, animation, and fragment references.

Common tasks

  • svg optimizer
  • svg minifier
  • svgo online
  • compress svg online
  • optimize svg file
  • svg cleaner
  • minify svg code
  • svg gzip size
  • svg optimizer no upload
  • free svg optimizer

Quick answer

Paste SVG markup or open an .svg file, choose number precision and cleanup options, then compare the original and SVGO-optimized image, raw bytes, and gzip size. AppHelp preserves viewBox, warns about IDs and external content, and lets you copy or download the result without uploading the asset.

How to use

  1. 1. Paste or open the SVGUse SVG markup or choose an .svg file under 2 MB. The sample demonstrates metadata, IDs, gradients, groups, and decimal values.
  2. 2. Choose optimization riskStart with comments, metadata, group cleanup, attribute sorting, multipass, and moderate number precision. Enable ID minification or dimension removal only when the embedding context supports it.
  3. 3. Compare image, markup, and transfer sizeSwitch between original and optimized previews, inspect generated markup, and compare both raw bytes and gzip size.
  4. 4. Test and exportReview warnings, test the SVG in its actual CSS, animation, sprite, or accessibility context, then copy or download the optimized file.

Examples

Design-tool icon export

Input
SVG with editor metadata, comments, nested groups, long decimal coordinates, and generated IDs
Output
Compact SVG with preserved viewBox and a visually comparable preview

Responsive inline SVG

Input
SVG with width, height, and viewBox
Output
Optional dimension removal while retaining viewBox-based scaling

Verify CSS sizing before removing width and height.

Common use cases

  • Reduce icon and illustration payload before shipping a web release
  • Clean SVG copied from Figma, Illustrator, Sketch, or another design tool
  • Compare raw and gzip savings before changing a production asset
  • Prepare responsive inline SVG markup while preserving viewBox
  • Audit potentially risky active, external, or raster content before embedding

Edge cases

  • Optimization is not a security sanitizer. Treat untrusted SVG as active content and apply a dedicated server-side policy before serving it inline.
  • ID cleanup can break CSS selectors, animation targets, URL fragments, gradients, masks, filters, scripts, and references from outside the file.
  • Low numeric precision can visibly distort small icons, complex paths, maps, or technical drawings.
  • Removing width and height changes intrinsic sizing; preserve and test the viewBox and final CSS layout.
  • Embedded raster images, fonts, and external resources may dominate transfer size even when the SVG markup becomes smaller.
  • A smaller raw file is not always proportionally smaller over HTTP because SVG is commonly gzip or Brotli compressed.

Features

  • SVGO 4 optimization in the browser with multipass and numeric precision controls
  • Original-versus-optimized image and markup comparison
  • Raw byte, percentage saved, and gzip size indicators
  • Comment, metadata, group, attribute, ID, dimension, and script controls
  • ViewBox preservation for responsive embedding
  • Safe preview that strips active and external content without disguising the downloadable result
  • Copy and SVG download with no account or asset upload

Related tools

SVG to PNG ConverterRender a tested SVG into a transparent or colored PNG at exact dimensions.SVG to React JSX ConverterTurn SVG markup into a configurable React or TypeScript component.Image CompressionCompress raster images locally when the asset is not truly vector.

Frequently asked questions

What does an SVG optimizer remove?
Depending on the settings, it can remove comments, editor metadata, redundant groups, unused definitions, excess decimal precision, unnecessary attributes, scripts, and other markup while rewriting paths and values more compactly.
Does this tool use SVGO?
Yes. The browser app uses SVGO 4 and exposes a focused set of high-value controls plus visual and transfer-size checks.
Why is the gzip saving different from the raw byte saving?
SVG is text, so repeated tags and attributes compress well. Gzip can make a verbose source surprisingly small, which is why both numbers are useful.
Should I minify SVG IDs?
Only after checking every internal and external dependency. ID changes can break CSS, animation, gradients, masks, filters, fragment links, scripts, or references from other files.
Why preserve viewBox?
The viewBox defines the SVG coordinate system and enables reliable responsive scaling. Removing it often causes resizing problems.
Is optimized SVG automatically safe to embed inline?
No. Minification and security sanitization solve different problems. This tool strips scripts when selected and uses a safer preview, but untrusted SVG still needs a deliberate security policy.
Are SVG files uploaded?
No. Reading, optimization, comparison, copying, and download happen locally in the browser.