svgtools
Free · Instant · CSS-vars ready

SVG Color Extractor & Palette Editor

See every color in an SVG at a glance, swap them with a click, or convert hardcoded values to CSS variables for theming. No sign-up, no server.

  • Extract unique colors from fills, strokes and gradient stops
  • Recolor visually — changes apply across the whole SVG
  • Convert hex colors to CSS variables for runtime theming
  • All processing local — your design files stay on your device

FAQ

How does color extraction work?

svgtools parses every fill, stroke, stop-color and inline style in your SVG and lists the unique colors. Click any swatch to recolor it everywhere it's used.

Can I convert hex colors to CSS variables?

Yes. Toggle 'Use CSS variables' and the export replaces hardcoded colors with var(--color-1), var(--color-2)… so you can theme the SVG from CSS.

Does it handle gradients?

Yes. Gradient stops are parsed alongside fills/strokes, so the extracted palette covers the full set of colors used.

Is it free?

Yes, fully free. No signup, no quota. Everything runs in your browser.

Related tools