recolour SVG

SVG Color Changer

Every colour in the file, gathered into one palette — edit any of them and see the result immediately, or hand the whole thing over to CSS with currentColor.

recolour SVG

☞ ทำงานในเบราว์เซอร์ของคุณทั้งหมด — ไม่มีการอัปโหลดไฟล์

Drop your SVG here

or click to browse — SVG only

one palette, every colour

Where colours hide in an SVG

A colour can sit on a fill or stroke attribute, inside an inline style, or in a stylesheet embedded in the file — and an export from Illustrator or Figma usually chooses the last one. That is why hand-editing an SVG in a text editor so often misses a few shapes.

This tool reads all three places, plus gradient stops and filter colours, and collects them into one palette. Change a swatch and every occurrence of that colour changes with it, wherever it was written.

three steps

How to change the colours in an SVG

01

Drop the SVG

Pick a .svg file — it stays on your device.

02

Edit a swatch

Each colour in the file gets one, with how often it is used.

03

Download

Only the colours change; the shapes are untouched.

quick answers

SVG color changer FAQ

What does currentColor actually do?

It tells the shape to use the text colour of whatever element it sits inside. An icon set to currentColor turns white inside a dark button and grey inside muted text, without a second file or a single extra CSS rule. It is the standard way icon libraries ship SVG.

Why can I not edit the gradient?

A gradient is a reference to a definition elsewhere in the file, not a colour, so replacing it would delete the gradient rather than recolour it. The individual stop colours inside the gradient do appear in the palette — edit those.

The palette is empty

Then the file has no colour of its own. That usually means the artwork is already set to currentColor or inherits its colour from a stylesheet outside the file. Open it in the SVG viewer to see the source.

Two shades that look identical share one swatch

Colours are grouped by what they actually resolve to, so #FFF, #ffffff and white are one entry. Editing it updates all of them, in whichever form each was written.

Is my file uploaded?

No. The file is parsed and rewritten in your browser.