HTML Color Names

HTML Color Names — All 148 CSS Named Colors with Search & Filter

Every HTML color name in one searchable reference: the full list of CSS named colors with HEX, RGB, and HSL values, live swatches, and one-click copy. Unlike static tables, you can filter by color family — all the blues, all the greens — and sort by hue, lightness, or saturation to actually browse colors the way a designer picks them.

There are exactly 148 named color keywords in the CSS Color Level 4 specification: 141 unique names plus 7 British "grey" spelling aliases. Many references still cite 140 — the spec says otherwise. This page also includes a nearest named color finder: paste any hex code and get the closest official CSS keyword, ranked by perceptual ΔE (CIELAB) distance.

How to Use the HTML Color Names Reference

Finding and copying a color takes seconds:

1. Type a name or hex code in the search box — the grid filters in real time as you type, matching names like tomato and hex fragments like ff63.
2. Filter by color family or change the sort order — pick "Blues" and sort by lightness to see every CSS blue from palest to darkest, something no static table offers.
3. Click any swatch to copy its HEX instantly — or click the name to open full details with RGB, HSL, ready-to-paste CSS snippets, and shareable banners for Instagram, WhatsApp, and X.
4. Find the nearest named color for any hex — paste a custom code like #517CBD into the finder and get the closest official keyword with its exact color distance.

HTML Color Name Examples

A few real lookups to show what the reference returns:

The finder accepts 3-digit shorthand too: #fa0 is expanded to #FFAA00 before matching.

What CSS Named Colors Are and Where They Come From

Named colors are plain-text keywords that work as values for any CSS color property: color: rebeccapurple renders identically to color: #663399. Browsers resolve the name to its RGB value at parse time, so there is no performance difference between a keyword and a hex code.

The 16 basic names (black, white, red, lime, navy, teal…) date back to HTML 4.01 (1997). The other names came from the X11 color system used by Unix graphical interfaces since the 1980s, were adopted by SVG, and were formally folded into CSS3 — which is why the list includes oddities like PapayaWhip, Bisque, and NavajoWhite. CSS Color Level 4 added one final entry in 2014: rebeccapurple.

The Story of RebeccaPurple

rebeccapurple (#663399) is the only CSS color named after a person. Rebecca Meyer, the daughter of CSS pioneer Eric Meyer, died of brain cancer on June 7, 2014 — her sixth birthday. The same day, the web community proposed adding the shade of purple she loved to the CSS specification in her memory, and the CSS Working Group approved it within hours. The full name "Rebecca" was used at her father's request: she had just outgrown the nickname "Becca." Developers worldwide still use the keyword as a quiet tribute.

Common Use Cases

• Prototyping and demos: background: cornflowerblue is faster to write and easier to read in a code sample than a hex code, which is why named colors dominate tutorials and CodePens.
• Finding a semantic name for a brand color: paste your hex into the nearest-color finder to discover whether an official keyword is close enough to use in quick mocks.
• Choosing a shade within one family: filter "Greens" and sort by lightness to scan all 23 CSS greens in order instead of hunting through an alphabetical table.
• Teaching and documentation: names like tomato and papayawhip are memorable, which makes them ideal for explaining CSS to beginners.
• Email and Markdown contexts: named colors survive copy-paste into environments where color pickers aren't available.

Common Mistakes with CSS Color Names

• Using green when you mean pure green: green is #008000, a half-brightness shade. Pure green (rgb(0, 255, 0)) is lime — a leftover from HTML 4.01 that still surprises developers.
• Writing grey as a standalone keyword: only gray is valid for the simple form. The British spelling does work in compound names, though — darkgrey, slategrey, and five others are legal aliases.
• Assuming named colors match Tailwind classes: text-purple-700 and rebeccapurple come from completely separate palettes. If you need an exact match, compare hex values — they almost never align.
• Counting on 140 colors: the spec defines 148 keywords. If your tooling validates color names against an older 140-entry list, newer keywords like rebeccapurple will be flagged incorrectly.

Frequently Asked Questions

How many HTML color names are there?

The CSS Color Level 4 specification defines exactly 148 named color keywords, plus the special values transparent and currentColor. That breaks down into 141 unique names and 7 British "grey" spelling aliases. The 16 basic names come from HTML 4.01; the rest derive from the X11/SVG color set, and rebeccapurple was added in 2014.

Why is there a CSS color called rebeccapurple?

It was added in 2014 in memory of Rebecca Meyer, the six-year-old daughter of CSS pioneer Eric Meyer, who died of brain cancer on her birthday. The web community proposed the color the day she died and the CSS Working Group approved it within hours. It is the only CSS color named after a real person.

What is the difference between lime and green in CSS?

lime is pure, maximum-brightness green: #00FF00. green is the darker half-brightness shade #008000. The naming comes from the original 16-color HTML 4.01 set, where green was defined as the medium tone. If you want the brightest possible green, use lime.

Is grey a valid CSS color?

Not as a standalone keyword — only gray (#808080) is valid in the simple form. However, both spellings work in compound names: darkgray/darkgrey, dimgray/dimgrey, lightgray/lightgrey, slategray/slategrey, and their slate variants are all legal, which is exactly why the keyword total is 148 rather than 141.

Can I find the closest CSS color name for any hex code?

Yes — paste the hex into the nearest named color finder on this page. It converts your color and all 148 keywords to the CIELAB color space and ranks matches by ΔE distance, which models human color perception far better than raw RGB distance. You get the best match plus the next closest alternatives.

Resources

• MDN — <named-color> — The canonical browser-documentation list of every named color with rendered swatches.
• W3C — CSS Color Module Level 4 — The official specification table defining all 148 keywords and their exact RGB values.
• Eric Meyer — In Memoriam, 2 — The post behind the rebeccapurple story, written by Rebecca's father.