Search tools

Type to filter all tools

SVG Optimizer

Shrink an SVG with SVGO. Paste the markup or drop a file, toggle every optimizer plugin individually, set the numeric precision and multipass, and compare the size before and after. Copy the result or download it as a file.

Everything runs locally in your browser. Your data never leaves your device.

Drop an .svg file here or click to browse. You can also paste the markup below.

Optimizer options

3 decimals

Document cruft

Styles and colors

Attributes and IDs

Shapes and paths

Structure

Sizing and root

Next steps

Send this tool's output straight into another tool.

About the SVG Optimizer

This tool runs your SVG through SVGO, the standard SVG optimizer, right on the page. Paste the markup or drop a file and the optimized result appears next to a before-and-after size comparison, usually a good deal smaller with no visible difference.

Every SVGO plugin is a switch you can flip. Start from the safe defaults, then enable the aggressive extras or disable anything that changes your file in a way you do not want. Numeric precision and multipass are exposed too.

What you can do

  • Minify an SVG exported from Figma, Illustrator or Inkscape.
  • Toggle each SVGO plugin individually to control exactly what is rewritten.
  • Reduce path precision to trade invisible detail for smaller files.
  • Compare the size before and after, with the saving as a percentage.
  • Preview the optimized SVG rendered next to the original.
  • Copy the optimized markup or download it as a file.

How to use the SVG Optimizer

  1. 1Paste SVG markup into the input, or drop an .svg file on it.
  2. 2Check the preview and the size numbers.
  3. 3Flip plugins on or off if the defaults removed something you need, like IDs you reference from CSS.
  4. 4Copy the result or download the optimized file.

When a plugin bites

A few plugins are worth knowing by name. removeViewBox deletes the viewBox attribute, which breaks responsive scaling, so it stays off here by default. cleanupIds renames or strips IDs, which matters when CSS or JavaScript outside the file references them. convertShapeToPath turns rectangles and circles into paths, which is fine for display but loses the semantic shape. If an optimized file misbehaves, turn plugins off in small groups to find the culprit.

What the numbers mean

The precision setting controls how many decimal places coordinates keep. SVGs exported from design tools often carry six or more decimals, far below what any screen can show. Three decimals is safe for icons, and one or two often still looks identical while cutting the file substantially. Multipass simply reruns the optimizer until the output stops shrinking.