SVG Optimizer
Optimize SVG files for smaller size
- Files never leave your device
- Runs in your browser
- Free, no sign-up, no watermark
Drop SVG files here, or click to choose
Accepts SVG, SVGZ · You can also paste with Ctrl+V / ⌘V
Tip: paste SVG code anywhere on this page with Ctrl+V / ⌘V.
How to use SVG Optimizer
Shrink SVG files with SVGO without leaving your browser. Pick the Default, Safe or Maximum preset or switch individual plugins, check a pixel diff against the original, and export the result as SVG, a data URI or a React component.
- 1
Drop SVG or SVGZ files on the page, or paste SVG code; Sample loads an example.
- 2
Under Optimization, choose Default, Safe or Maximum, and adjust Number precision, Multipass and Pretty print.
- 3
Optional: open the Plugins groups to turn individual SVGO plugins on or off; Reset returns to Default.
- 4
Compare the result Side by side, with the Slider, or under Differences, where changed pixels show in red.
- 5
Pick the SVG, Data URI or React tab, then click Download SVG or Download .jsx; for several files, use Download all (ZIP).
Frequently asked questions
Are my SVGs uploaded?
No. SVGO runs in a background worker in your browser, so the files never leave your device.
Will optimizing change how my SVG looks?
The Default preset aims for the same look. Differences renders both versions and reports the share of changed pixels, or Looks identical. A very low Number precision can distort fine details.
Which preset suits an animated or scripted SVG?
Safe. It leaves structure, IDs and shapes alone, so CSS selectors and scripts still find their elements.
Why did Maximum remove width and height?
Maximum also drops titles, dimensions and scripts, which suits icons used through CSS or img; the SVG then scales to its container. Untick removeDimensions under Web embedding to keep the size.
Should I use a Base64 or URL-encoded data URI?
Leave Base64 off in most cases: the URL-encoded URI is usually shorter and gzips better. Turn it on only where a tool expects Base64.
How does the React export work?
The React tab wraps the optimized SVG in a JSX component named after the file, with attributes rewritten for JSX and props passed to the svg element. Download .jsx saves it.