All 148 CSS Color Level 4 named colors with English and Chinese names, HEX, RGB, HSL, hue group, relative luminance and WCAG contrast. Search, filter by hue group, sort, and click a swatch to copy its HEX.
Runs in your browserEvery computation happens in your browser — your data never leaves this device.
Group
Sort
Total 148 colors · Matched 148 · Group:All · Sort:Name
Click a swatch to copy its HEX and see the full details below.
Click a swatch to copy its HEX and see the full details below.
What this tool does
Prefer a color name over a hex value in your CSS: search tomato, #ff6 or a Chinese name, then click the swatch to copy the HEX.
Pick a text color by contrast: sort by contrast with white and only look at entries at 4.5 or above, which are the ones usable as body text on white.
Browse a palette before committing: filter the 11 reds by hue group, or sort by lightness or hue to see the whole spread.
Verify a value you already have — pasting something like rgb(255, 99, 71) finds the matching named color along with HEX, RGB, HSL and luminance.
Example
Input
Search for tomato
Output
tomato (番茄红) HEX #FF6347; RGB rgb(255, 99, 71); HSL hsl(9.13, 100%, 63.92%); hue group red; relative luminance 0.3064; contrast 2.95 on white and 7.13 on black; below 4.5, so not usable as body text on white
The table holds 148 names, but nine spelling aliases share a value with another name (gray/grey, aqua/cyan, fuchsia/magenta and the grey spellings), leaving 139 distinct hex values.
Frequently asked questions
Why are there 148 names but only 139 values?
CSS defines several exact synonyms: gray and grey, aqua and cyan, fuchsia and magenta, plus the grey-spelled variants of darkgray, darkslategray, dimgray and friends. All of them stay in the table so you can search either spelling, but the underlying values repeat.
How is "usable as body text on white" decided?
By the WCAG 2.x threshold: a color passes AA for body text when its contrast against white is at least 4.5:1, and that is what the flag means. tomato only reaches 2.95 and is marked as unsafe; the large-text threshold is 3:1.
What can I type in the search box?
English names (prefix or substring), Chinese names (same), hex values including prefixes like #ff6, and literals such as rgb(255, 99, 71). Matches are ranked by relevance first, then by the sort order you selected.
Which format does clicking a swatch copy?
The uppercase six-digit HEX, for example #FF6347. The detail panel below shows the full RGB and HSL values, and the color converter can give you CMYK, HWB and other notations.
Does the color table update from the network?
No. The 148 names are the fixed CSS Color Module Level 4 set, shipped with the page, so it works offline; searching and copying happen locally with no requests at all.