replace color in image
Replace one color family without uploading the picture to a server. Pick a source pixel from a logo, cartoon, icon, screenshot, or simple background; choose the new HEX color; inspect the live mask; and save a full-resolution PNG. The workflow is deterministic, private, and free to use without an account or watermark.
Tested in modern browsers · August 1, 2026
replace color in image
Upload a raster image, click the exact source color, enter the replacement color, and raise tolerance until all intended shades appear in the selection mask. Keep Preserve lightness on when the area contains highlights or shadows. Turn on transparency when you want to remove the chosen color instead. Review the result, then download a PNG; the original file remains unchanged on your device.
replace color in image
The controls expose what is being selected and what will change, so a quick edit remains predictable instead of becoming an opaque AI request.
replace color in image
File decoding, pixel sampling, matching, recoloring, previewing, and PNG creation happen with Canvas in the current browser tab. No image is sent to Toon Tone, no login is requested, and a refresh clears the working image.
replace color in image
Preserve lightness transfers the new hue and saturation while retaining brightness differences found in the source. Flat fills change cleanly, while illustrated folds, glossy highlights, and soft shadows remain readable.
replace color in image
The mask view turns the chosen range white and everything else black. It reveals missed antialiasing, an over-wide tolerance, or unwanted background matches before you export the final PNG.
replace color in image
Upload, click the color to target, tune the range, and export a PNG. Processing stays in this browser tab.
replace color in image
PNG, JPG, WebP, GIF, AVIF or BMP · up to 12 MB · drag and drop or paste
replace color in image
0 × 0Click the original image to sample. Arrow keys move one pixel; Shift moves ten.
replace color in image
replace color in image
replace color in image
replace color in image
replace color in image
Start narrowly and expand the match only as far as the image requires. This prevents a source color shared by several objects from changing unexpectedly.
replace color in image
Choose PNG, JPEG, WebP, GIF, AVIF, or BMP up to 12 MB. The first frame of an animated image is edited. Large pictures are scaled to a 2400-pixel working edge so slider updates stay responsive; the displayed dimensions show the actual export size.
replace color in image
Click a representative middle tone inside the object, rather than an extreme highlight or dark outline. For precision, focus the original canvas and move the sample with arrow keys. Shift plus an arrow moves ten pixels at a time.
replace color in image
Begin with low tolerance, switch to the selection mask, and increase the value until the desired color family is white. Edge softness creates a gradual blend outside that core range, reducing hard halos around antialiased edges.
replace color in image
Enter any valid three- or six-digit HEX target and decide whether to preserve lightness. For background removal, enable transparency instead. Return to Result, check small details and download the edited pixels as a PNG.
replace color in image
A single pixel rule is excellent for graphic assets, but it is not semantic object recognition. Match the method to the material in the source file.
| Image task | Best setting | Expected result | Watch for |
|---|---|---|---|
| replace color in imageFlat logo or icon | Low tolerance, low softness | Crisp fill replacement | Shared brand colors |
| replace color in imageCartoon clothing or prop | Preserve lightness | New hue with retained shading | Colored outlines |
| replace color in imageSimple background | Transparency and mask view | Transparent PNG area | Similar foreground pixels |
| replace color in imagePhotographic object | Narrow range and careful review | Partial tonal recolor | Texture and reflected color |
replace color in image
Inspect the mask and final image at both normal size and close range. Six quick checks prevent most recoloring mistakes.
replace color in image
The editor uses documented browser pixel primitives and states its own implementation limits so the behavior can be reproduced.
replace color in image
MDN defines the pixel container directly:
The ImageData object represents the underlying pixel data of an area of a canvas object.
replace color in image
replace color in image
replace color in image
replace color in image
No. The selected file is decoded and processed in the current browser tab with Canvas. The page has no image-upload step, account requirement, or cloud history for this tool. Your browser creates the downloadable PNG locally. As with any sensitive file, close or refresh the tab when finished and avoid unrelated browser extensions that can read page content.
replace color in image
You can select PNG, JPEG, WebP, GIF, AVIF, or BMP files up to 12 MB when the browser supports decoding that format. For animated GIF or WebP input, the canvas captures a still frame rather than preserving animation. SVG is intentionally excluded because it is vector markup; edit its fill and stroke values in a vector editor instead.
replace color in image
The matcher compares pixel color values across the entire image and does not know which object a pixel belongs to. Two separate objects with similar RGB values can both fall inside the same tolerance. Lower tolerance, choose a more distinctive source pixel, or use a layer-based editor when selection must be restricted to one region.
replace color in image
Enable Preserve lightness and sample a representative middle tone. The tool then applies the replacement hue and saturation while keeping each matched pixel’s relative lightness. Very neutral colors, strong reflections, or compressed photographs may still need lower tolerance. Toggle the option and compare the same area in the live result before downloading.
replace color in image
Yes, when the background has a reasonably distinct color. Sample it, enable transparent replacement, inspect the mask, and use edge softness to retain smoother boundaries. Increase tolerance only until background variations are covered. If the foreground contains the same color, a global color range cannot separate it and a manual regional mask is safer.
replace color in image
With Preserve lightness off, fully matched opaque pixels use the target RGB values exactly. With it on, hue and saturation follow the target while lightness varies to retain shading, so individual HEX values differ. Partially matched edge pixels are blended according to softness. The result preview is the same edited ImageData used to create the downloaded PNG.