Optimize and minify SVG files — remove metadata, comments, hidden elements and unnecessary attributes to reduce SVG file size without losing visual quality. Preview before and after.
Paste SVG code directly into the editor, or click Upload SVG to load a .svg file from your device. The original SVG renders in the preview panel.
Select which optimizations to apply: remove metadata, strip comments, remove hidden elements, clean up attributes, round decimal precision, and more.
The optimized SVG renders alongside the original for visual comparison. Check the size reduction percentage, then copy or download the optimized SVG code.
The optimizer applies a configurable set of transformations: removes the <metadata> block and <desc> elements (added by design tools like Illustrator/Inkscape but not needed for web use), strips <!-- comments -->, removes hidden elements (visibility:hidden, display:none, opacity:0), removes unnecessary default attribute values (e.g. fill="black" when black is the default), rounds decimal coordinates to fewer decimal places (reducing file size significantly), removes empty groups and elements, and collapses nested groups where possible.
No — the optimizations are designed to be visually lossless. Removing metadata, comments, default attributes and hidden elements does not change what the SVG renders. Rounding decimal coordinates to 2 decimal places produces no visible difference at any realistic display size. The live before-and-after preview allows you to visually confirm both are identical before downloading. The optimizer does not alter path geometry, colours, gradients or any visual property.
Savings vary significantly depending on the source. SVGs exported from Adobe Illustrator typically save 40–70% (Illustrator adds extensive metadata, comments, and redundant attributes). SVGs from Sketch or Figma are typically cleaner but still see 15–30% reduction. Hand-coded SVGs may see less than 10% reduction if they are already clean. The optimizer reports exact file size before and after so you can measure the improvement for your specific file.
Removed elements: <metadata>, <sodipodi:namedview> (Inkscape specific), <dc:*> (Dublin Core metadata), <rdf:*> (RDF data), XML processing instructions, empty <defs> blocks, empty <g> groups, elements with display:none or visibility:hidden. Removed attributes: xml:space="preserve" (SVG default), version="1.1" (implied), xmlns:xlink when xlink:href is not used, id attributes on elements that are not referenced, and style attributes that duplicate presentation attribute defaults.
Standard CSS animations and SMIL animations defined within the SVG are preserved. The optimizer does not remove keyframes, animation attributes or CSS @keyframes blocks. However, SMIL animations (animateTransform, animate, animateMotion) that target elements by their id require those ids to be preserved. The optimizer checks for id references before removing any id attribute. If your animation is broken after optimization, enable the "Preserve all IDs" option.
Yes — SVG sprites (a single SVG containing multiple symbols referenced via <use href="#id">) are handled correctly. Symbol IDs and use references are preserved. The optimizer does not remove ids from <symbol> elements or any element that is referenced with a <use> element. Unused symbols (those with no corresponding <use> element in the file) can optionally be removed to reduce file size further.
Optimization makes semantically meaningful changes — removing unnecessary elements, attributes and metadata while preserving the SVG's function. Minification is purely textual — removing whitespace, newlines and comments to make the file a single compact line. This tool does both: optimization removes structural bloat, and minification removes textual whitespace. Combining both typically produces the maximum possible file size reduction.
Optimize before adding to your website. Optimized SVGs load faster (less data to transfer), parse faster (fewer DOM nodes), and render faster (fewer elements to process). The original non-optimized file should be kept in your design source control (Figma, Illustrator source files) for future editing. Never edit the optimized SVG in a design tool — the removed metadata is needed for re-editing. Always optimize from the original source on each export.
Yes — this is one of the most common use cases. Logo SVGs exported from design tools are typically far larger than necessary due to metadata and editor-specific elements. After optimization, the visual output is identical but the file loads much faster, especially when the logo appears on every page. For favicon SVGs (svg format supported by modern browsers as favicons), optimization is especially important since the file is requested on every page load.
SVGs with embedded base64-encoded images (raster images encoded as data URIs inside the SVG) are supported — the image data itself is not modified or re-compressed, only surrounding SVG structure is optimized. Embedded fonts (via @font-face or font data URIs) are also preserved intact. The optimizer does not attempt to compress binary data, only SVG XML structure and attributes.
