Choosing an SVG Optimization Pipeline
SVG files exported from design tools almost always carry redundant metadata, hidden layers, and inefficient path data. The usual fix is to run them through an optimizer, and the ecosystem offers options at every stage of a workflow: command-line, desktop, web, API, and design-tool integrations. There is no single best tool; each has strengths and quirks, and many projects combine them.
Command-Line Optimizers
The main standalone tools are SVGO, Scour, and svgcleaner. All three were effectively unmaintained for a while, though SVGO has since gained a maintainer again. The tools are not interchangeable: SVGO is the most popular but also the buggiest, svgcleaner is the fastest, and both Scour and svgcleaner can repair damaged SVG files, which SVGO cannot.
For build integration, SVGO is the one with mature task-runner wrappers:
- grunt-svgmin
- gulp-svgmin
- gulp-svgo
- svgo-loader for webpack
Desktop and Online Options
If you prefer a GUI, ImageOptim works on macOS, and there is a macOS folder action that runs SVGO on dropped files. A dedicated SVGO GUI existed but is 32-bit and no longer runs on Catalina or later. Generic image optimizers for Windows and Linux exist, but none are confirmed to handle SVG.
Web-based optimizers let you upload a single file and download the result. Notable ones include SVGOMG, Nano, Kraken, SVG Minifier, SVG optimiser, and the related svg-editor.
For programmatic use, there is the ImageOptim Web Service API and Kraken's API. Imgix supports SVG optimization if you opt in. Cloudinary is less clear: their API is upload-oriented, but they do support SVG transformations and offer an API-like fetch URL format.
Optimizing at Export Time
The design tool itself can reduce cleanup work. Figma does its best by default. Sketch users can install svgo-compressor, and there is a Sketch-specific web app called SVGito. Illustrator has SVG NOW. Inkscape can export as "Optimized SVG" (which internally uses Scour), or you can use the SVGO-Inkscape extension.
Learning to Optimize by Hand
Automated tools do not handle everything manually. For deeper understanding, several people have written practical walkthroughs:
- Michelle Barker: Optimising SVGs for the Web
- Jayden Seric: How to optimize SVG
- Sara Soueidan: Tips for Creating and Exporting Better SVGs for the Web and Useful SVGO[ptimization] Tools
- Cosima Mielke: Tools And Resources For Editing, Converting And Optimizing SVG
- Jake Giltsoff: SVG on the Web, Preparing & Optimising
- Andreas Larsen: Optimising SVGs for Web Use
- Josh Stoik: Optimizing SVGs For Web Use
For manual cleanup work, practical guides exist for reducing vector points in Illustrator (video from CSS-Tricks), creating and cleaning up SVG from scratch (video from Kevin Powell), and understanding how optimization works under the hood (article by Raymond Schwartz). Other resources include Amberd Design Studio's step-by-step guide, Brenda Storer's presentation, and Dudley Storey's basics.



