SVG Optimizer

How to use

1. 1Paste your SVG markup into the input area on the left, or click Load sample to try a typical Sketch export with editor metadata, namespace junk, and over-precise numbers.
2. 2Pick the optimizations to run: Remove comments, Remove editor metadata, Collapse default attributes, Remove empty groups, Round numeric precision, and (optional) Remove <title> and <desc>. Each is an independent toggle so you can dial the cleanup up or down.
3. 3Choose a numeric precision (1 to 5 decimals). Three is a good default for icons; one is fine for small flat shapes; five preserves complex illustrations.
4. 4Pick Minify for the smallest single-line output (best for production) or Pretty print for indented multi-line output (best for source control diffs).
5. 5Compare the original and optimized previews to confirm the rendering is unchanged, then click Copy SVG to copy the result, Download to save an .svg file, or Replace with optimized to feed it back as input for another pass.

About this tool

SVG Optimizer cleans and minifies SVG markup directly in your browser. Paste any SVG (icons, illustrations, charts, exported logos) and the tool parses it with the browser's built-in DOMParser, walks the tree, and re-emits a smaller, cleaner version with the transformations you choose. Each step is an independent toggle so you only run what you need: strip XML comments, drop the <metadata> element, remove every namespace and attribute belonging to Sketch, Figma, Inkscape, Illustrator, Adobe XMP, and similar editor toolchains, plus any unused xmlns declarations that those exports leave behind. A second pass collapses default attribute values that the SVG spec already implies (opacity="1", fill-opacity="1", stop-opacity="1", version="1.1", and x/y="0" on the root element), unwraps empty <g> groups (editor exports often nest several layers deep for nothing), and trims whitespace-only text nodes between elements while preserving the contents of <text>, <tspan>, <textPath>, <style>, and <script> where whitespace is significant. The numeric pass rounds every number found in the d attribute of <path>, in transform/gradientTransform/patternTransform, in viewBox, in points on <polyline> and <polygon>, and in every length, coordinate, opacity, and gradient-stop offset to a precision you choose between one and five decimals (three is a good default for icons). Output can be minified to a single line for production embedding, or pretty-printed for diff-friendly source control. Live before-and-after previews render the original and the optimized SVG side by side so you can confirm the visual stays identical, and the stats panel shows the original size, optimized size, bytes saved, and reduction percentage so you know exactly what you are shipping. The tool is conservative on purpose: it never reorders sibling elements, never inlines or splits attributes that affect rendering order, and never touches the contents of <style> or <script>, so the optimized SVG is byte-for-byte safe to swap into existing stylesheets and components. Useful for shrinking icon sets bundled in a UI library, cleaning Sketch and Figma exports before committing them, prepping logos for inline use in email templates, reducing the kilobytes shipped with hero illustrations, and turning the verbose paths editors emit into compact production-ready markup. The whole optimization runs locally on your device, so internal logos, unreleased icons, and any other SVG you paste here never leave your browser.

Free to use. Works in your browser. No signup, no login.