About This Tool
SVG Color Changer recolors icons, logos, and illustrations. It lists common color declarations and how often they occur. Choose replacement colors, check the static preview, and download the updated SVG.
How to Use
- Choose an SVG file or paste its source, then click Read Colors.
- Review the original colors, swatches, and counts. Set replacements for the colors you want to change.
- Apply the replacements and check fills, strokes, and gradients.
- Check your palette, then copy or download edited-colors.svg.
Features
- Finds common color values in fill, stroke, stop-color, flood-color, and lighting-color.
- Supports hex, rgb, rgba, common color names, attributes, and common style declarations.
- Replaces color declarations without changing matching text in body content, element IDs, or links.
Values that are not ordinary colors
- none means no paint, currentColor uses the current text color, and url(#gradient) refers to an internal gradient or pattern. These values are not replaced as ordinary colors.
- To change a gradient, edit its individual color stops. Complex inheritance or unsupported styles may keep the list from reflecting every color in the final image.
- The main download preserves unchanged content, including comments and metadata, and may retain scripts or external references. The preview filters these out; a separate filtered SVG download is also available.
SVG Safety
Previews use a filtered static copy. Scripts, click events, animations, external images, fonts, and styles do not run or load. External references, embedded web pages, and unsupported content are removed, so the preview may differ from the original. Documents with a DOCTYPE or custom entities are not supported.
SVG files and UTF-8 source are limited to 2 MiB, 20,000 nodes including elements and text, and 96 nesting levels. Simplify files that are too large or complex before trying again.
Privacy
Your SVG stays in your browser and is never uploaded to a server.
Inputs and results are not saved automatically. Download anything you want to keep before clearing the tool or leaving the page, and keep a copy of your original.
FAQ
Why can't I change every SVG color directly?
Some colors come from inheritance, the current text color, gradients, or complex styles rather than a fixed color value. Check the color list and preview first.
What is currentColor?
It uses the current text color instead of a fixed hex value, so it is not replaced as an ordinary color.
Why isn't url(#gradient) a regular color?
It refers to a gradient or pattern defined inside the SVG. To recolor a gradient, change its individual color stops.
Will changing colors alter the SVG structure?
Replacements target actual color declarations and do not turn paths into pixels. The main download preserves unchanged content; the filtered version removes unsupported active content and external references.