SVG Optimizer
An SVG exported from a design tool is mostly not drawing. It carries the editor's metadata, a comment block, layer names, coordinates written to six decimal places and attributes that repeat the defaults. This runs SVGO — the same optimizer the build tools use — over what you paste or drop, and shows the result next to the original: the new markup, the size before and after, what it comes to once gzipped (which is what a server actually sends), and both versions rendered so you can see at a glance that nothing broke. The switches are the ones that actually matter in practice: coordinate precision, whether to keep IDs that your CSS or JavaScript might be referencing, and whether to drop the width and height so the icon scales to its container. Everything runs in the page; the file is never uploaded.
Everything happens in your browser — the file is never uploaded.
How to use
- Paste your SVG into the box, or drop a .svg file onto it.
- Press Optimize. The size, the gzipped size and both renderings appear below.
- Turn down the precision if the file is still large — 1 or 2 decimals is usually invisible.
- Turn on "Keep IDs" if your CSS or JavaScript targets elements inside the SVG.
- Copy the result or download it as a .svg.
Frequently asked questions
- Is my SVG uploaded anywhere?
- No. SVGO runs inside your browser tab, on the text in the box. Nothing is sent to a server, and closing the tab leaves no copy behind.
- The two previews look identical. Is that expected?
- Yes — that is the point. Optimizing removes what does not draw and rewrites what does into a shorter form. If the previews differ, something in the file depended on what was removed; turn the precision back up or keep IDs and try again.
- When should I keep IDs?
- When anything outside the SVG refers to them: CSS like `#icon-star path`, JavaScript calling getElementById, or a `<use href="#…">` in another file. By default SVGO shortens IDs to save bytes, which breaks those references. Inside a single self-contained file, internal references are updated together and stay correct either way.
- What does the precision slider actually do?
- It rounds the numbers in path data. A coordinate like 12.345678 becomes 12.346 at 3 and 12.3 at 1. For an icon on screen, one or two decimals is normally indistinguishable and can cut a path in half. For a large or heavily zoomed illustration, rounding too hard becomes visible as wobble along curves.
- Why show a gzipped size?
- Because that is what actually travels. Web servers compress SVG, and the raw byte count overstates the saving — removing repeated whitespace looks dramatic on disk and barely registers after gzip. The gzipped pair is the honest comparison.
- Should I remove the width and height?
- Remove them if the SVG is used inline and sized by CSS — it then fills whatever box it is given. Keep them if it is used in an `<img>` tag or anywhere a browser needs an intrinsic size, otherwise it may render at a default size. The viewBox is always kept; without it the drawing would have no coordinate system left to scale.
Related tools
PDF Compressor
Shrink a PDF by re-encoding the images inside it. Text stays selectable and searchable. Nothing is uploaded.
Image Compressor
Compress and resize JPEG, PNG, and WebP images in your browser.
HTML / CSS / JS Minifier
Strip whitespace and comments from HTML, CSS, or JavaScript — see the size saved and copy the result.
SVG → PNG Converter
Rasterize SVG to a PNG at any size, with transparent or solid background, all in the browser.
Audio Trimmer
Cut a clip out of an audio file by dragging across its waveform, add fades, and download it as a WAV. Nothing is uploaded.
HAR File Inspector (HTTP Archive Viewer)
Drop a .har file from Chrome / Firefox / Safari DevTools and instantly see every request — method, status, size, time, content type — with stats, slowest/largest tables, and filterable / sortable entries. Runs entirely in your browser.