Image

Image Colour Replacer

Replace a colour throughout an image with a tolerance and soft edge, using perceptual distance so the selection matches what the eye considers the same colour.

Last reviewed by the Radiatus Cloud team

Drop an image here, click to browse, or paste one
Everything happens in your browser. Nothing is uploaded anywhere.
Preview appears here.

Need this done properly for your business?

Radiatus delivers secure cloud, DevOps & compliance engineering.

Book a free consult

Selecting a colour is not selecting one value

What looks like a single flat colour in an image almost never is. Compression, anti-aliasing, gradients and noise mean a "red" area contains hundreds of slightly different reds, so replacing an exact value changes a fraction of the pixels and leaves a speckled mess. Every usable colour replacement therefore works with a tolerance, and the question becomes how to measure whether two colours are close enough.

Perceptual distance beats RGB distance

Measuring the straight line distance between two RGB values treats a change in green as equal to the same change in blue, which does not match how the eye works. A tolerance tuned to catch all the variations of one colour then also catches parts of a different one. Measuring in a perceptual space makes the tolerance behave consistently: the same setting selects what a person would call the same colour, whichever colour that is.

The edge is where replacements look wrong

Anti-aliased boundaries contain pixels that are a blend of the shape and its background. A hard selection either includes them, leaving a fringe of the old colour blended with the new, or excludes them, leaving a halo of the original. Fading the replacement in proportion to how close each pixel is to the target colour handles the boundary smoothly, which is the difference between a replacement that looks deliberate and one that looks like a mistake.

Related tools

  • EXIF Viewer — Extract hidden EXIF data (Camera, GPS, Settings) from images.
  • Favicon Generator — Generate favicons and app icons at every required size from one source image, with the exact HTML to reference them.
  • Placeholder Image Generator — Generate placeholder images at any size with custom colours and label text. Produced in your browser as downloadable files, no external hotlinking.
  • Image Resizer — Resize images in your browser with aspect ratio control and format conversion. Files are processed locally and never uploaded.

Frequently Asked Questions

Why does replacing an exact colour barely change anything?

Because a flat-looking area contains hundreds of slightly different values from compression, anti-aliasing and noise. Only a small fraction of pixels match any single value exactly, so a tolerance is essential.

What tolerance should I use?

Start low and raise it until the whole area is selected, then stop. Too high and it starts catching other colours, which shows as unexpected patches elsewhere in the image.

Why do I get a fringe around the replaced area?

Because anti-aliased edge pixels are a blend of the shape and its background, so they neither match the target nor the surroundings. Fading the replacement in proportion to closeness handles those pixels smoothly.

Does this preserve shading?

Optionally. Replacing the hue while keeping the original lightness preserves shadows and highlights, so a shaded object still looks shaded. Replacing the colour outright flattens it, which suits flat graphics.

Can I make a colour transparent instead?

Yes, which is the usual way to remove a solid background. It has the same edge problem, and the soft edge option is what stops a halo of the old background colour remaining around the subject.

Privacy & Security

Everything runs in your browser; nothing is uploaded.

Data: None
Client-side-Side
Active
v1.0

How to Use

Upload an image, pick the colour to replace and the one to replace it with.

Disclaimer: This tool is provided "as is" without warranty of any kind. Results are for educational and utility purposes.