The all-in-one SVG toolkit that runs in your browser

SVG Tools is a free, privacy-first toolkit for designers and front-end developers. Clean up exports from Figma, Illustrator and Sketch, shrink files for production, turn artwork into framework components, or vectorise a raster image — all without uploading anything. Every operation runs locally in your browser.

Minify & optimize SVG

Strip editor metadata and comments, then run SVGO for deep optimization — path-data crunching, coordinate rounding and attribute merging — with a live gzipped-size readout so you see real wire weight.

Convert SVG to code

Export to CSS background-image, an optimized Data URI, or ready-to-use React, Vue, Svelte, Flutter, Jetpack Compose and SwiftUI components with size and color props.

PNG & JPG to SVG

Trace raster images into clean vector paths with presets for flat logos, detailed art, posterized shapes or black-and-white line art — perfect for rescuing low-resolution logos.

Favicon package generator

Turn one SVG into every icon size a modern site needs, plus a real favicon.ico, a web manifest and a copy-paste <head> snippet — bundled in a single ZIP.

Recolor & edit live

Extract an SVG's color palette and swap colors with an instant preview, or fine-tune fills, strokes, opacity and dimensions in the visual attribute editor.

Sprite sheets

Combine multiple icons into a single <symbol> sprite with usage examples, so you can reference any glyph with <use href="#id">.

Frequently asked questions

Is my SVG uploaded to a server?

No. Every operation — minifying, optimizing, converting, tracing and favicon generation — runs entirely in your browser. Your files never leave your device, which makes the tool safe for proprietary and client work.

How do I convert a PNG or JPG to SVG?

Open the PNG→SVG tab, choose a PNG or JPG, pick a detail preset, and the image is traced into scalable vector paths right in your browser. Flat and black-and-white presets work best for logos and icons.

What does the SVG optimizer actually do?

The Optimize tab runs SVGO, which crunches path data, rounds coordinates to a precision you choose, strips editor metadata and merges attributes — typically cutting file size substantially while preserving how the graphic looks.

Can I generate favicons from an SVG?

Yes. The Favicon tab renders your SVG to every common icon size, builds a real favicon.ico, a site.webmanifest and an HTML snippet, and downloads them as one ZIP you can drop into your site root.

Which frameworks can I export components for?

React (JSX), Vue 3, Svelte, Flutter (Dart), Jetpack Compose (Kotlin) and SwiftUI — each with an option to expose width, height and color as props.