Developer / SVG colours

SVG Colour Changer: Recolour and Copy SVG

Inspect explicit SVG colours and their usage counts, edit gradient stops and simple CSS paint rules, then download the SVG or copy its code.

SVG Colour Changer: Recolour and Copy SVG: Finds explicit paint tokens in fill, stroke, stop-color, color, flood-color and lighting-color attributes, inline styles and simple style rules. Named colours, short hex, rgb() and hsl() are normalised. Replacements preserve other source bytes where sanitising does not require changes. Runs 100% locally in your browser with zero server file uploads.

Runs
In your browser
Cost
Free · no sign-up
Availability
Ready to use
SVG colour changerLocal processing

Runs entirely in your browser

Choose or drop an SVG

SVG paint

SVG fill, stroke and gradient stops use colour values and paint-server references. Specification: https://www.w3.org/TR/SVG2/painting.html

Colour syntax

The parser supports named colours, hex, rgb(), hsl() and currentColor. Alpha is retained when supplied. CSS variables and advanced colour spaces are outside this tool's parser. Specification: https://www.w3.org/TR/css-color-4/

How to use it

  1. Drop an SVG or paste its markup.
  2. Use each colour picker or enter a replacement; optionally recolour all tokens at once.
  3. Compare before and after, then download or copy the sanitised SVG.

Privacy & limitations

SVG code stays in your browser. Previews are isolated images, and unsafe content and external resources are removed.

Related tools

Frequently asked questions

What does the usage count count?

Explicit colour tokens in the markup, not the number of rendered pixels or elements receiving an inherited style.

Are gradients supported?

Yes. Gradient stop colours can be changed without replacing gradient IDs or references.

What does currentColor do?

It uses the inherited CSS color value when the SVG is embedded inline. An image preview normally uses black unless the SVG itself defines color.

Is every CSS colour resolved?

No. CSS variables, advanced colour spaces, inherited defaults and computed selector results are not resolved. Simple declarations and selectors are supported.

Free tool · runs in your browser · no account required