Optimize an SVG in the Browser: Shrink It Without Uploading It

An SVG that came out of a design tool is usually bigger than it needs to be. It carries editor metadata, leftover layer names and sometimes a <script> block from whatever exported it. Before you ship it as a favicon, an inline icon or a logo, you want it smaller — and you want to see by how much.

Full disclosure: I work on OnePassApps. Its Icon Studio has an Optimize SVG tool, and the page describes itself as "Create icons and favicon assets on this device. Files stay in your active browser tab."

What the tool promises

The panel is three steps, the same shape as the rest of the Studio:

• 01 Source — "No SVG yet. Drop one on the stage or browse for it. SVG up to 5 MiB and 25,000 elements."
• 02 What changes — three lines that spell out the trade:
  • Keeps — "The viewBox and every visible shape"
  • Removes — "Scripts, event handlers and external references"
  • Compares — "The byte sizes before and after"
• 03 Result — "Ready", then the two sizes side by side, the new file name and a "Create again" button.

The promise is deliberately narrow. The viewBox and the visible shapes stay, scripts and external references go, and the before/after byte counts are put next to each other so you can judge it rather than take it on trust.

What it did to my file

I dropped in a small test SVG (120 × 120, a rounded rectangle, a circle, plus a <title>, a <metadata> block and a <script> element) and pressed Optimize SVG. The source stage read:

probe.svg
SVG · 120 × 120 · 387 B

The result step came back with:

Ready
Before        387 B   SVG
After         238 B   SVG
Size change   38.5% smaller
File name     probe-optimized.svg
Created in 0.7 s

Under it there is a Download SVG button and a summary line: "SVG reduced by 149 bytes (39%)." The result also comes with a Dark/Light preview, which is the quick way to check that a mark with a transparent or white fill still reads against both backgrounds.

"Your original stays untouched." The file you dropped is not rewritten in place — you get a new file next to it, probe-optimized.svg.

Why this is a browser job

An SVG is small, so it is easy to assume you can post it anywhere. But "post it anywhere" is exactly the thing you do not want to do with an icon that has not shipped yet: a public converter sees your file, keeps a copy, and may start serving it behind a CDN. This one never leaves the tab — the page says "Processing stays in this browser." — and the file you get back is a local download.

Where it fits in the Studio

Icon Studio is not only about optimisation. The same page has SVG to PNG, PNG to ICO, Favicon pack, App icons, Resize set, Optimize SVG, Recolour SVG and Trim / padding tabs, so the whole chain — optimise, recolour, trim the padding, rasterise, then pack a favicon set and app icons — can be done in one place without the file making a round trip to a server in the middle.

Standard is free right now: $0/month with 100,000 credits every 30 days, no end date set and no card required. There is more on the guides page if you want the wider picture.