SVG Minifier & Optimizer
An SVG exported from Illustrator, Sketch, or Figma is frequently two to five times larger than the same drawing needs to be. The excess is editor bookkeeping and unnecessary decimal places, none of which affects what renders. Minification removes it.
How to use it
- Drop in a .svg file.
- Metadata, editor namespaces, comments, and redundant precision are stripped in the page.
- Download the optimized SVG.
Where the weight actually is
Design tools embed a surprising amount of information that only they can use, and every byte of it ships to your users.
The usual offenders, in rough order of impact:
- Coordinate precision. Editors routinely emit six or more decimal places on every path coordinate. At normal display sizes anything beyond two decimals is smaller than a pixel and cannot possibly be visible. On a complex path with hundreds of points, trimming precision alone often removes half the file.
- Editor namespaces and attributes. Blocks declaring sodipodi, inkscape, or Adobe-specific namespaces, plus per-element editor state, serve no rendering purpose outside the originating application.
- Metadata and comments. Generator strings, RDF licensing blocks, creation timestamps, and the XML declaration itself.
- Hidden and empty elements. Layers left invisible, groups containing nothing, and defs blocks whose contents are never referenced still download in full.
- Redundant attributes. Default values written out explicitly, and duplicated presentation attributes that a parent element already sets.
What is deliberately preserved
Minification here is conservative about anything that can change behaviour rather than just size. Element IDs are kept, because CSS rules, JavaScript, and internal references such as clip paths and gradient fills all depend on them, and renaming them is how minifiers break sprite sheets.
Accessibility content is kept for the same reason: title and desc elements, along with ARIA attributes, are what screen readers announce. A minifier that strips them makes the file smaller and the site less usable.
Inline style blocks and animation elements are also preserved, since removing them changes what the file does rather than how compactly it says it.
Serve it compressed as well
SVG is text, so it compresses extremely well over the wire. Gzip typically takes a minified SVG to around a third of its size, and Brotli does slightly better. Minification and transport compression are complementary rather than alternatives: minifying removes content, compressing encodes what remains more efficiently.
If your server is already sending image/svg+xml with compression enabled, the practical saving from minification is smaller than the raw byte count suggests, but it still applies, and it also reduces parse time in the browser.
At a glance
| Accepted input | .svg |
|---|---|
| Removed | Editor metadata, comments, excess precision, empty nodes |
| Preserved | IDs, title, desc, ARIA attributes, inline styles |
| Typical reduction | 40 to 70 percent on editor exports |
Frequently asked questions
Will minifying break my CSS or JavaScript hooks?
No. Element IDs and class names are preserved precisely because external CSS, scripts, and internal references such as gradients and clip paths depend on them.
How much smaller should I expect the file to get?
Editor exports commonly drop by 40 to 70 percent. A hand-written SVG that is already tidy may barely change, because there was nothing redundant to remove.
Does it affect how the image looks?
It should not. Coordinate precision is reduced only to the point where the difference is far below one pixel at normal display sizes.
Is accessibility information retained?
Yes. title and desc elements and ARIA attributes are kept. They are what assistive technology reads, and removing them for a few bytes is a poor trade.
Read more
Choosing an image format — Why the same photograph can be 40 KB or 4 MB depending on a single dropdown, and how to choose deliberately.