SVG Cleaner
Clean up an SVG icon: strip editor clutter, normalize size, stroke and color, then copy or download it.
Use the tool
Load an SVG
Presets
24px, currentColor stroke, ready to save as a .svg
Size
> width and height
> stroke width
Color
> stroke
> fill
Classes and access
> utility classes
> accessibility
Cleanup
> editor metadata
> inline style attrs
> round decimals
> xmlns
> format
before
-
after
-
saved
-
> preview on
> inputpaste or drop a file
no preview
Cleaned SVG
The cleaned SVG appears here.
no preview
Filename and download
> saved patterns
Patterns you save stay in this browser.
> case
CSS snippet
> class sits on
CSS
.icon {
display: inline-block;
flex-shrink: 0;
width: 1.5rem;
height: 1.5rem;
color: var(--primary);
stroke-width: 1.75;
}
> how to use it
- 01
Paste SVG code, drop a file, or fetch one from a URL. Try the sample icon to see what changes.
- 02
Choose a preset, then adjust size, stroke, fill, classes and accessibility.
- 03
Compare the original and cleaned previews and the file size saved.
- 04
Name the file with a pattern and download it, or copy the markup and the matching CSS.
FAQ
SVG Cleaner questions.
Why clean an SVG?
Design tools add metadata, comments and extra precision that bloat the file without changing how it looks. Normalizing size and color also makes icons behave the same way across a set.
Will it change how my SVG looks?
Metadata and precision changes should not. Options like forcing currentColor or removing fill do change appearance on purpose, so check the preview, and use Light cleanup for complex artwork.
Is my SVG uploaded anywhere?
No. Parsing and cleaning happen in your browser. Fetching from a URL requests that address directly from your browser, and scripts inside an SVG are always removed.
Why would a URL fetch fail?
The host has to allow cross-origin requests. CDNs like unpkg do. If a site blocks it, download the file and drop it onto the input instead.
Inline markup or a file?
Inline SVG without xmlns and a fixed size lets CSS control it, which suits icons in HTML. Files need xmlns to open on their own. The presets set both for you.