Micro Tool Yard logo
Tools

Drag & drop an SVG here

Minify markup and shrink file size — nothing leaves your device.

Ad Slot

How it works

  1. Drop your SVG

    Nothing is uploaded — the file is read directly in your browser.

  2. Pick a preset

    Safe, Balanced, or Aggressive — or dig into individual plugin controls.

  3. Optimize

    A background worker minifies the markup without touching the rest of the page.

  4. Compare and download

    See the before/after side by side and the exact size saved before downloading.

SVG Optimizer runs svgo — the standard, widely-used SVG optimizer — entirely inside your browser via its dedicated browser build, so no file is ever sent to a server. Your SVG's markup is parsed, run through a configurable pipeline of cleanup plugins (removing comments, metadata, and redundant structure, and rounding numeric precision), and serialized back into minified XML, all inside a background worker.

Three presets cover the common cases without requiring any SVG internals knowledge: Safe sticks to svgo's standard, low-risk cleanup; Balanced adds multi-pass optimization and strips fixed width/height in favor of viewBox, which is usually the right choice for icons and illustrations embedded responsively; Aggressive pushes numeric rounding further for the smallest possible file. Power users can go further still, individually toggling any of the underlying cleanup plugins in the "Advanced" panel — useful when, say, an SVG's element IDs are referenced by external CSS and need to survive optimization unchanged.

Because a size number alone doesn't prove nothing broke, every optimization shows a side-by-side before/after render on a transparency checkerboard, alongside the exact byte size saved — so you can confirm the result looks right before downloading it.

Most of an unoptimized SVG's file size isn't the actual shape data — it's editor metadata (Illustrator or Figma export comments, unused <defs> entries, XML namespaces nothing references), verbose numeric precision (coordinates exported to far more decimal places than are ever visually distinguishable), and redundant attributes that could be inherited or simplified. A typical icon exported straight from a design tool can often shrink by 50–70% with zero visible difference, purely by removing content that was never rendering anything in the first place — which is why the Safe preset alone is usually worth running on every SVG before it ships, even without reaching for the more aggressive presets.


FAQ

Is my SVG uploaded anywhere?
No. Optimization runs entirely in your browser via a background worker — no file is ever uploaded, and no network request is made.
What's the difference between the presets?
Safe applies svgo's standard cleanup (comments, metadata, and redundant markup) with no changes that risk altering appearance. Balanced adds multi-pass optimization and removes fixed width/height attributes in favor of viewBox, which is usually what you want for responsive embedding. Aggressive does the same as Balanced with tighter number rounding for the smallest possible file — check the before/after preview if you use it on precision graphics.
Will optimizing change how my SVG looks?
The Safe and Balanced presets are designed not to. Aggressive rounds numeric values more tightly, which can very occasionally cause a tiny visual shift in complex path data — that's exactly why the before/after preview is shown before you download, so you can verify it yourself rather than take it on faith.
What do the individual plugin controls do?
Each preset is built from svgo's standard set of cleanup plugins, and the "Advanced" panel lets you turn any of them on or off individually — useful if, for example, you need to keep an SVG's IDs intact because external CSS or JavaScript references them, but still want everything else in the preset applied.