What is actually inside an exported SVG
Design tools save SVG files for themselves first and for browsers second. A simple icon exported from Inkscape can carry a sodipodi:namedview block with your zoom level and window position, RDF license metadata, layer labels, and coordinates printed to six decimal places. Illustrator adds its own namespaces, a generator comment and enable-background. Figma and Sketch add data-name attributes and IDs on every shape. None of it changes a single pixel, yet it routinely doubles the file size.
What each option does
Safe every time
- Remove comments and editor metadata. Drops comments,
<metadata>, and every element and attribute in the Inkscape, Sodipodi, Sketch, Figma, Serif and Adobe namespaces. - Remove unused IDs. IDs referenced by gradients, clip paths, masks or
<use>are kept; the rest are deleted. - Collapse whitespace and shorten colors. Pure byte savings with no visual effect.
Check the preview
- Round numbers. Two decimals is invisible for icons and logos drawn at typical sizes. Very small viewBoxes (like 0 0 1 1) need more precision, so watch the after preview when you go lower.
- Remove title and desc. Fine for decorative icons, but keep them for inline SVGs that convey meaning, because assistive technology reads them.
- Drop width and height. Makes the graphic fluid so CSS controls its size. If the SVG has no viewBox, the tool creates one from the old width and height first.
Using the result on your site
For icons that should inherit text color, inline the optimized SVG and swap hard-coded fills for currentColor. For decorative backgrounds, a CSS data URI avoids an extra request:
.section-divider{
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 10'%3E%3Cpath d='M0 10 50 0l50 10z' fill='%23ffb547'/%3E%3C/svg%3E") bottom / 100% auto no-repeat;
}
The data URI button uses URL-encoding rather than base64. SVG is plain text, so encoding only the few characters that need it keeps the string shorter and lets gzip and Brotli compress it well.
Where this tool stops
This is a careful cleaner, not a geometry engine. It does not merge paths, convert shapes to paths or rewrite curves the way SVGO's most aggressive plugins do. That is a deliberate trade: every change here is predictable and safe to run on a client's logo without a second look. Your file is processed entirely in your browser and never uploaded.
Frequently asked questions
Will optimizing change how my SVG looks?
Not with the default settings. Comments, editor metadata and unused IDs have no visual effect. Rounding to 2 decimals is invisible at normal sizes; drop to 1 or 0 only for large, simple shapes, and always check the after preview.
Why remove width and height?
With only a viewBox, the SVG scales to whatever size its container or CSS gives it, which is what you want for responsive icons and logos. Keep width and height if the SVG must render at a fixed size in email or older tools.
Should I keep the title element?
Keep it when the SVG is inlined and meaningful, because screen readers can announce it. For decorative icons, or SVGs used through an img tag with its own alt text, it is safe to remove.
Why URL-encode instead of base64 for CSS data URIs?
SVG is text, so URL-encoding only escapes a few characters and stays readable. Base64 inflates the size by about a third and compresses worse with gzip and Brotli.