How to optimize an SVG file
Add an SVG, choose the cleanup options, and inspect the native Before and After previews before downloading the result. SVG Optimizer reads the file, checks its XML, and requires <svg> as the root element. The file stays in the browser: the page uses local file reading, parsing, preview, and download APIs, with no request that sends the SVG content to a server.
How to optimize an SVG with the controls
- Drop an SVG here, or click
browse filesand choose a file whose name ends in.svgor whose type isimage/svg+xml. - Wait for the file to load, then review the warning panel. Invalid XML or a root element other than
<svg>stops the file from loading. - Clear any cleanup options you want to skip. When
Reduce numeric precisionis checked, setDecimal placesfrom0to4. - Compare
BeforeandAfter, then read the change report. - Click
Download optimized SVGto save the result.
What each cleanup changes
Remove comments & insignificant whitespace removes XML comments and whitespace-only text nodes outside text, tspan, textpath, style, and script elements. Remove metadata & editor data (Inkscape/Illustrator/Sodipodi/RDF) removes metadata plus matching editor elements and attributes. It leaves <title> elements in place.
Clean up redundant/empty attributes removes empty attributes and an unused xmlns:xlink declaration. Clean up IDs (unused removed, used ones shortened - references preserved) removes unreferenced IDs, shortens referenced IDs, and rewrites supported href, xlink:href, and url(#id) references. Reduce numeric precision rounds selected dimensions, path data, points, transforms, and viewBox values.
Input: <svg viewBox="0 0 100.0000 50.0000"><rect id="unused-box" x="10.456" y="5.678"/></svg>
Output: <svg viewBox="0 0 100 50"><rect x="10.46" y="5.68"/></svg>Warnings and limits
The warning panel reports scripts, inline event handlers, external references, filters, SMIL animation, <foreignObject>, raster <image> references, and inline <style> content. The optimizer leaves those constructs in place. It does not edit bitmap data. Inline style text stays as written, except that supported url(#id) references can change when ID cleanup is enabled.
CSS selector references such as #id inside a style block are not treated as supported ID references. Numeric cleanup changes selected markup values, so compare both previews before saving.
When SVG Optimizer fits
Use the editor-data cleanup on an exported logo before placing the SVG in a project. Use ID cleanup and numeric rounding when you want to inspect the changed markup alongside the original render.
If an asset is an animated GIF, GIF Compressor is the better choice because it has controls for frame rate, dimensions, colors, dithering, and looping. For a raster image with a quality preset or target file size, use Image Compressor. SVG Optimizer belongs with the Image Compress Tools when the source is SVG markup.
Frequently asked questions
Can I compress SVG markup without converting it?
Yes. SVG Optimizer returns SVG markup and renders SVG previews; it does not create a PNG or canvas snapshot.
What does reduce numeric precision do to an SVG?
It rounds selected numeric values in attributes, paths, points, transforms, and viewBox according to Decimal places.
Can SVG Optimizer remove unused IDs?
Yes. Clean up IDs (unused removed, used ones shortened - references preserved) removes IDs it cannot find in its supported references and shortens referenced IDs.
Does SVG Optimizer upload my file?
No. The implementation reads, parses, previews, and downloads the file in the browser, with no request that sends the SVG content to a server.