Color Name Finder
Paste any color and find out what it’s called: the closest CSS color names, ranked by perceptual distance, with exact-match detection and synonyms. Free and 100% in your browser.
| Swatch | CSS name | Hex | Distance | Copy |
|---|---|---|---|---|
| royalblue | #4169e1 | ΔE 4.1 | ||
| steelblue | #4682b4 | ΔE 11 | ||
| slateblue | #6a5acd | ΔE 12 | ||
| mediumslateblue | #7b68ee | ΔE 14 | ||
| slategrayalso “slategrey” | #708090 | ΔE 16 | ||
| dodgerblue | #1e90ff | ΔE 17 |
Every color has a nearest name
CSS defines 148 named colors — from workhorses like black and gray to curiosities like papayawhip, lightgoldenrodyellow and rebeccapurple. Whatever color you paste above, this tool measures its distance to all of them with CIEDE2000, the same perceptual difference formula the color industry uses, and shows the closest six. If the distance is essentially zero you have an exact keyword you can type straight into a stylesheet.
Reading the distance column
| ΔE (CIEDE2000) | What it means |
|---|---|
| < 1 | Indistinguishable — treat the name as exact |
| 1 – 2 | Visible only side by side, on close inspection |
| 2 – 10 | Same family; the name is a fair description |
| > 10 | A loose label — “bluish”, not “this blue” |
A short history of the strange names
The list wasn’t designed — it accreted. Most names came from the X11 window system’s color file, which itself absorbed a 1950s crayon-adjacent vocabulary; that is why the web has peachpuff and navajowhite but no plain “brick”. Some pairs are pure spelling history: cyan and aqua, magenta and fuchsia, and every gray/grey twin are byte-for-byte identical. The one deliberate addition is rebeccapurple (#663399), named in 2014 in memory of web pioneer Eric Meyer’s daughter — a small permanent memorial inside every browser.
What names are actually good for
- Communication: “it’s basically royalblue” lands faster than “#3564c4”.
- Prototypes and teaching: readable examples without a token system.
- Sanity checks: if your six nearest names are all grays, your “blue” has drifted further than you think.
For production code, prefer design tokens with hex or oklch() values — the universal color converter shows every notation for any name. And if you got your color from a photo, it probably came from the image picker on the home page. Everything here runs 100% in your browser; nothing is uploaded.
Frequently asked questions
Where do these color names come from?
They are the 148 named colors defined in the CSS specification — usable directly in any stylesheet, like color: crimson. The set descends from the historic X11 color list, plus rebeccapurple, added in 2014 in memory of Eric Meyer’s daughter.
How is the “closest” name determined?
Every named color is compared to your input with CIEDE2000, the industry-standard perceptual color-difference formula, and the smallest distances win. A ΔE below 2 is barely distinguishable; above 10 the name is only a rough family label.
Why do some names appear with a second name in parentheses?
A few values have two official spellings — cyan/aqua, magenta/fuchsia, and the gray/grey pairs. Both names refer to exactly the same color.
Should I use color names in production CSS?
They are great for prototypes, demos and readable examples. Production code usually sticks to design-token variables with hex or oklch() values — but knowing that your brand blue is “basically royalblue” makes it much easier to talk about.
Is my color sent anywhere to find the name?
No — the lookup runs against a local table entirely in your browser, and works offline once the page is loaded.