SVG Optimizer

What this tool is used for

• Shrinking an SVG exported from a design tool, which is usually very verbose.
• Removing editor metadata and comments before committing an asset.
• Reducing an icon's size before inlining it.
• Comparing before and after size for a set of assets.
• Cleaning up an SVG whose markup is unreadable.

Frequently Asked Questions

What does it actually strip?

Editor artefacts — the XML declaration, comments, `<metadata>`, `<title>` and `<desc>`, `version` and `xml:space` attributes, empty attributes, `data-*` attributes, unused `id`s — and then collapses whitespace between tags.

How does it know an id is unused?

It collects every id referenced by `url(#…)`, `href="#…"`, `xlink:href` and SMIL `begin`/`end` timing values, then removes only ids not in that set. Stripping ids blindly breaks gradients, clip paths and filters.

Should I remove title and desc?

Not on an inline SVG that conveys meaning — `<title>` is the accessible name a screen reader announces. Removing it is right for a decorative icon marked `aria-hidden`, and wrong for a standalone chart or logo carrying information.

Why is xmlns:xlink sometimes kept?

It is only removed when nothing in the document actually uses an `xlink:` prefix. Dropping the namespace declaration while a `xlink:href` remains produces a document that fails to parse in strict XML contexts.

Is the saving measured in real bytes?

Yes — both sizes are measured with a UTF-8 encoder rather than by string length, so a file containing non-ASCII text reports what it will actually cost on the wire rather than a count of code units.

Does this replace a full optimiser?

For editor exports, it removes the bulk of the waste with no build step. Path-data reduction, shape merging and precision trimming are where a full pipeline such as SVGO goes further, at the cost of needing to run in your toolchain.

Common errors and gotchas

• Removing the viewBox, which stops the SVG scaling with its container.
• Stripping ids that a `use` reference, a gradient or an animation depends on.
• Removing `aria-label` or `title`, which the asset needed for accessibility.
• Over-optimising path precision, which visibly deforms curves at large sizes.
• Optimising an SVG whose script or style it needed, which some optimisers strip.