recolour SVG
☞ runs entirely in your browser — nothing is uploadedDrop your SVG here
or click to browse — SVG only
Preview
OneImageTool
Free Image Tools
recolour SVG
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.
or click to browse — SVG only
Preview
one palette, every colour
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
Pick a .svg file — it stays on your device.
Each colour in the file gets one, with how often it is used.
Only the colours change; the shapes are untouched.
quick answers
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.
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.
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.
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.
No. The file is parsed and rewritten in your browser.