No SVG yet
Paste SVG code or upload a .svg file// clean and minify SVG files instantly
Free browser-based SVG optimizer. Clean, minify, and optimize SVG files by removing comments, metadata, empty tags, and redundant attributes. Paste or upload — nothing sent to server. No sign-up required.
No SVG yet
Paste SVG code or upload a .svg filePaste SVG code directly into the input textarea, or click Upload to load a .svg file from your device.
Toggle the options you want — remove comments, metadata, editor namespaces, default attributes, or minify whitespace.
Click Optimize SVG, then copy the result to clipboard or download the cleaned .svg file. Toggle Preview to see it rendered.
A free browser-based SVG optimizer that applies a configurable set of cleaning passes: removing editor metadata, comments, DOCTYPE declarations, empty groups, default attributes, and whitespace — all client-side. Includes a live preview with background toggle and size comparison stats.
The tool removes several categories of non-visual content that design tools add automatically. These include Inkscape-specific attributes (inkscape: namespace), Sodipodi attributes, Dublin Core metadata (dc:), Creative Commons licensing (cc:), RDF metadata (rdf:), Adobe Illustrator namespace attributes, and Sketch export data. It also removes <metadata> blocks, <title> and <desc> elements, XML declarations, and DOCTYPE statements.
For most SVGs, all enabled passes are safe and will not affect the visual output. ID minification is the riskiest pass — if your SVG uses url(#id) references in fill or filter attributes, the IDs must match. This tool preserves all internal cross-references during ID minification. However, if your SVG IDs are referenced from an external CSS stylesheet or JavaScript, enabling ID minification will break those links. For that reason, ID minification is off by default.
SVG has many attributes with well-defined default values. For example, fill-opacity="1", stroke="none", stroke-width="1", opacity="1", and display="inline" are all defaults — they have no effect if removed. Design tools often write every attribute explicitly, which wastes bytes. This pass removes attributes whose value exactly matches the SVG specification default, reducing file size without changing appearance.
Inkscape adds a significant amount of non-visual data to exported SVGs: editor namespace declarations, layer labels, guide data, export hints, document history in RDF/Dublin Core format, and sometimes embedded raster images as Base64. A simple icon that should be 1–2 KB can become 10–20 KB straight out of Inkscape. Running it through this optimizer typically reduces it by 40–80%.
No. All optimization passes run entirely in your browser using JavaScript string manipulation and regex. Your SVG code never leaves your device — nothing is sent to any server. This makes the tool safe for use with proprietary icons, brand assets, and client work.
SVGO is a Node.js tool with a comprehensive plugin system and more advanced optimizations like path merging, transform consolidation, and shape-to-path conversion. This tool covers the most common and highest-impact passes in a zero-install browser interface. For files requiring path-level optimization, running SVGO locally after this initial cleanup will further reduce size. For most icon and illustration SVGs, this tool alone reduces 40–75% of file size.
SVG files exported from design tools like Inkscape, Adobe Illustrator, or Sketch contain large amounts of non-visual data: editor metadata, namespace declarations, embedded license information, layer names, and formatting whitespace. A simple icon that should be 500 bytes can easily become 5–15 KB when exported directly from a design tool. This extra data adds no visual value and increases page load time, CSS file size (for inlined SVGs), and HTTP response sizes.
Optimizing SVGs before deploying them to production is one of the highest-return-on-effort performance improvements available — particularly for icon-heavy interfaces where dozens of SVGs may be loaded per page.
Each optimization option in this tool is independent and targets a specific type of bloat. Comments are documentation for the designer but wasted bytes in production. DOCTYPE and XML declarations are unnecessary in HTML5 — browsers infer the SVG namespace. Metadata blocks in Inkscape exports often contain the full edit history and licensing information, sometimes larger than the actual vector content. Editor namespace attributes (inkscape:, sodipodi:, etc.) serve no purpose in rendered SVG. Empty groups are artifacts of collapsed layers. Default attributes are values that would apply anyway without being stated. Whitespace minification removes the indentation and newlines used for human readability.
There are cases where you want to keep some elements that this tool removes by default. Keep <title> if your SVG is used as an inline icon in an accessibility-sensitive context — screen readers use the title as the accessible name. Keep IDs in their original form if they are referenced from external CSS or JavaScript. Keep <desc> for decorative SVGs where a description improves screen reader context. The tool's per-option toggles let you exclude any pass you need to preserve.
A practical workflow: export SVG from your design tool, run it through this optimizer with all default options enabled, visually verify the Preview renders correctly, then copy the output. For React/Vue projects, the resulting minified SVG can be pasted directly as JSX or a template literal. For HTML use, the output is ready for an <img src="…"> reference or inline <svg> block. For CSS background use, convert the output to a data URI using the Image to Base64 tool.