Paste or drop an SVG exported from Figma, Illustrator or Sketch and watch it shrink. Real SVGO optimization with tunable precision, a live before/after size meter, and a checkerboard preview so you can confirm nothing broke: all in your browser, never uploaded.
The SVG Optimizer runs real SVGO in your browser to clean files exported from Figma, Illustrator or Sketch, stripping editor metadata, rounding coordinates and dropping hidden layers. A before/after size meter shows exact bytes and percent saved, with a checkerboard preview. Free and never uploaded.
The GigAI SVG Optimizer is a desktop-grade cleaner for SVG markup that runs SVGO's full optimization pipeline directly in your browser. Design-tool exports are notoriously bloated: Figma, Illustrator and Sketch bake in editor metadata, invisible layers, redundant groups, absurdly precise coordinates and namespaced junk that can easily triple a file's size. Paste your SVG, drop a.svg file, or import one, and the optimizer strips comments and editor namespaces, collapses redundant transforms and groups, rounds path data to a precision you control, converts styles to attributes and removes hidden elements, then reports the exact bytes before and after, the percentage saved, and an estimated gzipped size so you know what actually ships. A live checkerboard preview renders the optimized result next to the code so you can instantly confirm the visual is identical, which is the one thing raw minifiers never show you. Every knob that matters is exposed without a config file: coordinate precision, whether to keep the viewBox (removing it silently breaks responsive scaling), whether to strip width/height for fluid sizing, multipass, and whether to remove IDs or the title/desc used by assistive tech. When SVGO's chunk can't load, a built-in fallback optimizer keeps the tool working. Because it is 100% client-side, brand assets, unreleased logos and internal icons never leave your machine, close the tab and every trace is gone.
Last updated
Paste markup into the editor, drop a .svg file anywhere on the workspace, or click Import. A sample loads in one click if you just want to see it work.
Set coordinate precision and choose whether to keep the viewBox, strip width/height, remove IDs, drop title/desc or run multipass. Everything re-optimizes live as you change a knob.
Glance at the checkerboard preview to confirm the artwork is unchanged, and read the before/after byte, percentage-saved and gzip-estimate badges.
Copy the optimized SVG to your clipboard, download it as a .svg, or share a link that reopens the tool with your source pre-loaded.
Runs SVGO's full preset, collapsing groups, merging paths, converting styles to attributes and dropping editor namespaces, the same engine build tools use, with no upload and no install.
Slide path/coordinate precision from lossless to aggressive. Fewer decimals means smaller files. The live preview lets you push until you can just start to see it, then back off one step.
See input bytes, output bytes, percentage saved and an estimated gzipped size the moment you paste, so you know the real shipping weight, not just the raw number.
The optimized SVG renders live on a transparency checkerboard beside the code, so you can confirm the artwork is pixel-identical before you copy, the safety net raw minifiers skip.
Keep viewBox on, IDs and title/desc preserved by default so nothing breaks. Opt in to removing dimensions for fluid scaling or stripping IDs when you know nothing references them.
Parsing and optimization happen on your device. Brand marks, unreleased logos and internal icon sets are never uploaded, stored or logged: a fallback optimizer even keeps it working offline.
Design-tool exports routinely shrink 40–70%. Multiply that across an icon set or an inline logo on every page and it is real bytes off your bundle and your Largest Contentful Paint.
Unlike command-line SVGO, the live preview shows the optimized result next to the source, so you catch the rare case where an aggressive setting clips a gradient or a clip-path before it ships.
Get SVGO-quality output without wiring up a build plugin or an svgo.config.js, and without sending confidential brand assets to a third-party server.
Optimized markup is clean enough to paste straight into JSX, a Vue template or an HTML file, and small enough to drop into a data-URI without bloating your CSS.
From quick one-off fixes to daily workflows, see how people put this tool to use.
Optimize the SVG logo you inline in the header of every page, shaving repeated bytes off HTML that ships on every request and nudging LCP in the right direction.
Strip the metadata, hidden layers and 12-decimal coordinates Figma bakes into an export, and confirm on the checkerboard that the icon still renders exactly as designed.
Run every icon through the same precision and toggle settings so your sprite or React icon library is consistent and as small as possible before it hits the registry.
Minify a decorative SVG hard enough to embed it as an inline background-image data-URI without bloating a stylesheet or a marketing email.
Accepts SVG, and produces SVG, all processed locally in your browser.
Aggressively minify SVG online: collapse whitespace, strip comments, metadata and editor namespaces, and squeeze markup to a single line with a live before/after size and % saved. 100% in your browser.
Convert SVG to a clean React component in your browser, camelCased attributes, TypeScript or JS, memo, forwardRef and React Native output, with a live preview. Nothing is uploaded.
Convert SVG to a data: URI in your browser, URL-encoded or base64, and copy it as a CSS background, an inline <img src>, or the raw URI, with a live size comparison. Nothing is uploaded.
Open, paste or drop an SVG to view it on a checkerboard, light or dark canvas with zoom, live dimensions, a source-code pane and a full element/color report: 100% in your browser, nothing uploaded.
Shrink JPG, PNG and WebP images without a visible quality drop. Set the quality yourself, or compress to an exact target size like 100 KB. Free, entirely in your browser.
Format and indent SVG source in your browser, turn a minified one-liner into clean, diff-friendly markup with consistent indentation and one element per line. Nothing is uploaded, and no data is removed.
The same engine runs behind the free API: send files, get signed download links back, and everything is deleted after the retention you choose. 1,000 tasks a month, no card.
Also runs as a task inside a job - chain it with the other engines. See the recipes.
curl -X POST https://api.gigai.tools/v1/jobs \
-H "Authorization: Bearer $GIGAI_API_KEY" \
-H "Content-Type: application/json" \
-d '{ "tasks": {
"in": { "operation": "import/url", "url": "https://example.com/input.svg" },
"work": { "operation": "optimize-svg", "input": ["in"] },
"out": { "operation": "export/url", "input": ["work"] }
} }'
# then poll until finished and follow the export URL:
curl https://api.gigai.tools/v1/jobs/JOB_ID/wait -H "Authorization: Bearer $GIGAI_API_KEY"Go deeper on the concepts behind the svg optimizer.
SVG is resolution-independent code that scales to any size and stays tiny for simple graphics. PNG is fixed-resolution pixels ideal for detail and screenshots. How to do it to choose.
Read the comparisonStrip the bloat from an SVG so it loads faster and stays razor-sharp: free, in your browser, no watermark. A step-by-step guide to optimizing SVG files.
Read the guideHit a snag? Here are quick fixes for the issues people run into most.
You almost certainly removed the viewBox. Turn 'Keep viewBox' back on: the viewBox is what lets an SVG scale to its container. If you want fluid sizing, keep the viewBox and instead enable 'Remove width/height'.
IDs were probably removed while something still points at them (a <use xlink:href>, a gradient, a clip-path or a CSS selector). Disable 'Remove IDs'. SVGO can't see references that live outside the file.
Precision is too aggressive for this artwork. Raise the precision by a decimal place or two and watch the preview. Smooth gradients and small icons need more decimals than large flat shapes.
The optimizer needs actual SVG markup starting with an <svg> tag. If you pasted a data-URI or a base64 blob, decode it to raw SVG first, or import the .svg file directly.
Start at precision 2–3 for icons and only lower it if the preview stays crisp: that's where most of the savings live.
Keep the viewBox on and enable 'Remove width/height' when you want the SVG to scale fluidly to its container.
Leave 'Remove IDs' off for anything used in a sprite, referenced by <use>, or targeted by CSS/JS. SVGO can't see external references.
Optimize before converting to a data-URI or a React component so the embedded/inlined markup starts as small as possible.
Preserve title/desc on meaningful graphics, screen readers use them, and the byte cost is tiny.
Recent updates and improvements to the svg optimizer.
Initial release, client-side SVGO optimization with tunable precision, keep-viewBox / remove-dimensions / remove-IDs / remove-title toggles, multipass, live checkerboard preview, before/after byte + gzip meter, copy, download, undo/redo and shareable links.
Added a dependency-free fallback optimizer so the tool keeps working when SVGO's chunk can't load, plus keyboard shortcuts and a curated set of sample SVGs.
Refined the gzip-size estimate and added clearer guidance around viewBox removal and ID stripping to prevent broken sprites.
Your SVG is parsed and optimized entirely in your browser. It is never uploaded to any server. Nothing is stored, logged or transmitted, so you can safely optimize unreleased logos, brand marks and internal icon sets. If SVGO's optimizer can't load, a built-in fallback runs locally too. Close the tab and every trace is gone.
Free, private and instant. SVG Optimizer runs right in your browser.
