Specimen no. 03 · the label
Color name finder
Type or pick any color and get its closest names: the nearest CSS keyword you can use in a stylesheet, and the nearest of thousands of community names, each with its distance.
HEX, rgb(), hsl(), hwb(), oklch(), oklab() or a CSS name.
Try
#c96f8a
- HEX
#c96f8a- RGB
- HSL
- OKLCH
Nearest names
Loading the name list…
How names are matched
Your color is converted to OKLab and measured against every name on the list; the shortest straight-line distance wins. That distance is called ΔEOK, shown here multiplied by 100. The CSS Color 4 specification treats 2 on this scale as about one just-noticeable difference, so below 2 a name is as good as exact, around 5 it is a near neighbor, and past 10 it only shares the family.
Two kinds of names are searched. The 148 CSS named colors, like rebeccapurple or olivedrab, are the only ones you can type straight into a stylesheet. The larger lists come from color-name-list, an MIT-licensed collection curated by David Aerne and contributors: the handpicked list of about five thousand names loads first, and the full list of over thirty thousand only when you switch to it. Both are part of this site's own files, so nothing is looked up online.
You can type a color in almost any CSS form: #c96f8a, c96f8a, rgb(201 111 138), hsl(342 45.5% 61.2%) or oklch(65% 0.117 1.7). An OKLCH or OKLab value outside sRGB is first pulled inside it, keeping its lightness and hue.
Sources
- W3C, CSS Color Module Level 4: the named colors, the OKLab and OKLCH notations, and the deltaEOK just-noticeable difference of 0.02 used in its gamut mapping.
- Björn Ottosson, A perceptual color space for image processing (2020): the OKLab color space.
- David Aerne and contributors, color-name-list, MIT License: the handpicked and full name lists.
Questions
Which names can I use in CSS?
Only the 148 CSS named colors. The community names are for talking about color: design notes, variable names, product listings or paint-chip style labels. In code, use the HEX or OKLCH value next to them.
Why do some colors have two CSS names?
CSS accepts both spellings of gray and grey in every gray name, and two pairs are exact twins: aqua and cyan, fuchsia and magenta. The finder shows them together.
Is this distance the same as Delta E 2000?
No. CIEDE2000 is a more involved formula built on CIELAB, while ΔEOK is a plain distance in OKLab. The numbers are not interchangeable, although both put a just-noticeable step in the low single digits.