Replace a color in an SVG

Replace all occurrences of one color (fill, stroke or inline CSS style) with another in an SVG file, with a live preview of the result.

Example:

Which color formats does this tool detect?

The tool searches for the specified color in its hexadecimal form, whether written in long notation (#4f46e5) or short notation (#4fe), and regardless of the attribute or location where it appears: fill="...", stroke="...", or inside an inline style="fill:...;" attribute. Case (uppercase/lowercase) doesn't matter.

What happens if my SVG uses named colors (e.g. "red") or RGB?

This tool only searches for colors in hexadecimal format. If your SVG uses CSS color names (like red) or rgb(...) notation, convert them to hexadecimal first (for example with our color converter) before using this tool.

Does the replacement work if the color appears several times?

Yes, every occurrence of the searched color in the document is replaced in a single operation, no matter how many SVG elements use it (paths, shapes, inline styles).

100% local processing: the search and replace happen entirely in your browser, and your SVG file is never sent to a server.