Color name finder
Paste a color in HEX, rgb(), hsl() or another notation and see the five closest CSS named colors, ranked by perceptual distance. Type a name instead to get its exact value.
Runs in your browser: nothing you enter is sent anywhere.
How to use it
- Type or paste a color. HEX with or without the hash,
rgb(...), hsl(...), hsv(...), cmyk(...) and oklch(...) all work.
- Read the list: the first row is the closest named color, followed by four more. Each row shows the HEX and the distance.
- To go the other way, type a color name. The tool shows its HEX and RGB values and any other name for the same color.
How it works
Every color is converted from sRGB to OKLab. The tool computes the Euclidean distance between your color and each of the 148 CSS names and sorts the results. Names that share one value (gray and grey, aqua and cyan, fuchsia and magenta) appear as a single row such as gray / grey. The distance is shown multiplied by 100 and rounded to one decimal.
Example
#fe0000 is one step away from pure red in the red channel, so the nearest name is red with a distance well below one. #3366cc has no exact name; the list shows the closest blues and purples instead, each with how far away it is.
Tips
- A small distance, roughly under 2, means the name describes your color well. Larger distances mean the name is only a rough label.
- Names are handy for readable stylesheets, but HEX stays more precise. Use the name when it is an exact match.
- Use the Copy button next to a row to take the name straight into your CSS.
Frequently asked questions
How many named colors does CSS have?
CSS Color Module Level 4 defines 148 color keywords, rebeccapurple included. They collapse to 139 distinct colors because gray and grey, aqua and cyan, and fuchsia and magenta share a value. This tool lists all of them.
How is the nearest color chosen?
Both colors are converted to OKLab, a color space built so equal numeric steps look like equal differences to the eye. The tool picks the names with the smallest straight-line distance there, multiplied by 100 for readability. A distance of 0 means an exact match.
Why does the answer sometimes differ from a plain RGB comparison?
Comparing red, green and blue channels directly overweights differences the eye barely notices and underweights others. OKLab distance follows perception more closely, so it can pick a different name than a channel-by-channel comparison would.
Can I type a name to get its HEX?
Yes. Names are case-insensitive and spaces, hyphens and underscores are ignored, so Rebecca Purple, rebecca-purple and rebeccapurple all give #663399.