Grayscale Color Converter

Convert a colour to its grayscale equivalent using perceptual luminance.

Colour
Grayscale
Runs locally in your browser

About the Grayscale Color Converter

Converting a colour to grey is not just averaging the channels; the eye is far more sensitive to green than to blue, so a good conversion weights them accordingly. This tool uses the standard luminance weights (about 30 percent red, 59 percent green, 11 percent blue) to produce a grey that matches the colour's perceived brightness, and shows it as a swatch with HEX and RGB.

Those coefficients come from the Rec. 601 standard and are applied to the channel values as they are stored, which is a deliberate simplification. sRGB values are gamma-encoded, so a strictly correct conversion would linearise them, apply the weights, then re-encode. The gap is a few units of brightness and rarely changes which grey you would pick, but it does explain why an image editor and a CSS filter can report slightly different results for the same pixel.

A quick sanity check is to run a whole palette through and see whether the greys stay apart. If a chart legend collapses into three near-identical tones, the chart is carrying its meaning in colour alone and needs patterns, labels or direct annotation instead. It is useful for checking how a colour reads in greyscale (for print or for colour-blind readers), and for generating a neutral tone with the same lightness as a colour.

To simulate specific types of colour blindness, use the Color Blindness Simulator. To apply the same treatment to a photograph rather than a single value, the Grayscale Image tool works on a file.

How to use

  1. Enter a colour.
  2. Copy the grayscale value.

Common questions

Why not just average the channels?
The eye weights green most and blue least. Luminance weighting gives a grey that matches the perceived brightness.
What are the weights?
Approximately 0.299 red, 0.587 green, 0.114 blue, the standard luminance coefficients.
Does this help with accessibility?
Seeing a design in grayscale reveals whether it relies on colour alone to convey meaning.