Optimize and minify SVG in your browser. Strip metadata, round precision, and export as SVG, data URI, or Base64. See bytes saved.
Share this tool
Found it useful? Help a fellow developer discover it.
When you export an SVG from Figma, Illustrator, Sketch, or Inkscape, the file contains far more than the rendering instructions. Design tools embed their own XML namespaces, layer names, comments, editor state, font metadata, and coordinate data with unnecessary decimal precision. None of that reaches the screen, but all of it is downloaded. A logo that should be 2 KB can easily come out of a design tool at 10 KB or more. This tool runs SVGO, the industry-standard SVG optimizer, compiled for browser use so your files never leave your device. The default passes are conservative: they remove the bloat without touching anything that affects the visual output. The one opinionated pass, removing width and height attributes to make the SVG fluid, is opt-in and marked with a warning so you choose when to use it.
Editor metadata
Figma, Illustrator, Sketch, and Inkscape all embed proprietary XML namespaces and metadata nodes that have no effect on rendering.
XML comments
Comment nodes add bytes and expose internal notes. Safe to remove from production assets.
Hidden elements
Elements with display:none or visibility:hidden are invisible but still parsed and downloaded by the browser.
Redundant attributes
Default attribute values (fill="black", opacity="1") can be removed because the browser applies those defaults anyway.
Excess numeric precision
Path coordinates are often exported with 6 decimal places. Rounding to 2 saves bytes with no visible change at typical screen sizes.
The default passes remove editor metadata, XML comments, hidden elements, redundant attributes, and extra numeric precision. None of these affect the rendered image. Optional passes like removing width and height attributes are toggleable.
Editor exports from Figma, Illustrator, or Sketch typically shrink by 40 to 70 percent. The exact savings depend on how much editor metadata is embedded. The tool shows the exact bytes saved and percentage reduction after each optimization.
The default passes are safe and preserve the visual output exactly. The one opinionated option (removing width and height attributes) is off by default and marked with a warning. Enable it only when you want the SVG to scale responsively with CSS.
Yes. Switch the export format to Data URI or Base64 and copy the output into a CSS background-image property. The Data URI format gives you a url("data:image/svg+xml;base64,...") value you can paste directly.
No. Optimization runs entirely in your browser using the SVGO library compiled for browser use. The preview is sanitized with DOMPurify before rendering, so arbitrary SVG scripts cannot execute.
CSS Formatter
Format, beautify, and minify CSS code online. Shows byte reduction percentage on minify.
Image to Base64
Convert PNG, JPG, GIF, WebP, SVG, and BMP to Base64. Output as raw string, CSS background-image, or HTML <img> tag. Drag & drop.
XML Formatter
Format, beautify, and minify XML online. Validates XML structure and supports custom indentation.
CSS Gradient & Box-Shadow Generator
Generate linear, radial, and conic CSS gradients and layered box-shadows with a live preview. Copy ready-to-use CSS.
