Skip to content
UniKit

Color name table

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.

Keywords:color namecss colornamed colorcolor tablehexrgbhslcontrast颜色名称颜色速查CSS 颜色色值表对比度

Related tools