HTML color codes include the 148 opaque CSS named-color keywords standardized by W3C CSS Color 4, each tied to a single lowercase six-digit HEX value and a matching decimal rgb() mapping. The phrase covers more ground than it sounds like it does: in practice, designers and developers searching for HTML color codes usually want one of three things — a quick lookup of a specific named color's exact HEX, a complete list of every keyword CSS accepts, or a fast way to copy a stable, standardized value into a stylesheet without guessing what the browser will interpret. The HTML Color Names Chart was built for that exact task. It puts all 148 standardized opaque keywords into a single searchable table, with a rendered swatch, the lowercase #RRGGBB string, the matching decimal rgb(r, g, b) triple, and one-click clipboard copying — all running locally in the browser, so no search or copied value is sent to a server. That makes it a practical daily reference for translating legacy stylesheets, picking readable keywords for prototypes, checking the exact value behind a name, and copying stable color tokens into new CSS.
What HTML Color Codes Cover in CSS
HTML color codes is an umbrella term that covers four technically distinct CSS color formats. The W3C CSS Color specification supports hexadecimal notation such as #ff6347, the functional rgb() form like rgb(255, 99, 71), the HSL family for hue, saturation, and lightness, and a closed list of named-color keywords such as tomato, rebeccapurple, or lightseagreen. Each format ends up producing the same kind of sRGB pixel value when the browser parses it; the difference is purely syntactic and editorial.
The named-color layer is the one most relevant to a search for HTML color codes. It is the only CSS color format that is human-readable in plain English, the only one that lets a designer pick a swatch without doing arithmetic in their head, and the only one that is fixed and finite rather than open-ended. Modern CSS recognizes exactly 148 opaque keywords in that list. The complete list, including aliases like aqua/cyan and fuchsia/magenta, plus both American and British gray spellings, is curated and stable across browsers.
Hex and rgb() are functionally interchangeable. Browsers treat #ff6347 and rgb(255, 99, 71) as the same sRGB value, and most style guides recommend picking one and using it consistently across a project. HSL is the perceptual alternative — separating hue (a degree on the color wheel) from saturation and lightness (percentages) — and is useful when adjusting colors by feel rather than by channel arithmetic. The HTML Color Names Chart focuses on the keyword layer because that is the layer where typos and stale references most often break legacy stylesheets.
The 148 Standardized CSS Named Colors
The CSS Color 4 specification defines exactly 148 opaque named-color keywords, and the HTML Color Names Chart reflects that count one row at a time. Per the W3C named-color list, every keyword in the chart resolves to a single lowercase six-digit HEX value and a single decimal rgb(r, g, b) mapping; nothing is rounded, no values are approximated, and no rows are invented outside the spec. The chart excludes two CSS keywords that beginners often expect to see: transparent and currentColor. Transparent is a special alpha-bearing keyword that represents transparent black rather than an opaque named swatch, so including it in an opaque table would produce a misleading numeric mapping. currentColor has no fixed standalone HEX at all — it always resolves to the element's computed color property at render time, so its value depends on context. Keeping both outside the 148-row count is the honest way to report what the spec actually standardizes.
All 148 keywords resolve in the sRGB color space. That is the same color space monitors, phone screens, and uncalibrated browser previews all use, so a value you copy from the chart will look the same on the screen you took it from. The names are historical identifiers, not a perceptually even palette. They are not a scientific taxonomy of color, not an accessibility rating, and not a guarantee that any particular display reproduces a physical pigment accurately. Some neighboring names look surprisingly similar — gainsboro and lightgray, for example, are close enough that most people cannot tell them apart on a typical screen. Use the chart to translate intent into an exact sRGB triple; do not use the names themselves as a substitute for measuring accessibility or print fidelity.
How to Look Up a Color and Copy Its HEX
Working with the chart is a three-step task: filter, inspect, copy. Each step is keyboard-driven and reversible.
- Open the chart at /color/named-colors-chart/ and click into the filter box at the top of the table.
- Type a partial CSS color name (case-insensitive fragment match), an exact six-digit HEX value prefixed with #, or a complete rgb(r, g, b) string. The chart matches keyword fragments in ASCII order, exact HEX by the leading #, and full rgb() by the entire numeric triple — short numeric fragments will not accidentally match unrelated channels.
- Review the matching keyword, the rendered swatch, the lowercase HEX, and the decimal RGB. Click the HEX value to write it to the clipboard; if the browser denies clipboard permission, the keyword, HEX, and RGB text remain selectable for manual copying. Clear the filter box to restore all 148 opaque rows in their original ASCII-alphabetical order.
A few behaviors are worth knowing before you start filtering:
- The chart never merges aliases, invents fuzzy synonyms, or converts between color spaces. If you type aqua you see aqua; if you type cyan you see cyan; both rows display the same #00ffff mapping.
- If a search has no match, the chart shows a no-match message rather than substituting a nearby color, so a typo is obvious instead of being silently papered over.
- Copying always writes the lowercase six-digit HEX exactly as displayed, with no CSS declaration wrapping it and no capitalization changes.
- Clearing the filter always restores the full 148 rows; filtering never permanently hides a row.
Why Aliases Like Aqua/Cyan and Fuchsia/Magenta Matter
A reader who expects a strict one-keyword-one-row reference will see duplicates and reasonably ask why. The chart preserves standardized aliases as separate rows on purpose. Aqua and cyan both map to #00ffff, and fuchsia and magenta both map to #ff00ff; the chart keeps both rows because each spelling is a valid CSS identifier, recognized by every modern browser, and either spelling can appear in code you inherit or have to maintain. Merging them would obscure a real fact about CSS: a stylesheet containing aqua behaves identically to one containing cyan, but only one of those names is what the author actually wrote. The same logic applies to the American and British spellings of gray — gray, grey, darkgray, darkgrey, lightgray, lightgrey, dimgray, and dimgrey all appear as separate valid rows with matching values.
| Keyword | HEX | RGB |
|---|---|---|
| aqua | #00ffff | rgb(0, 255, 255) |
| cyan | #00ffff | rgb(0, 255, 255) |
| fuchsia | #ff00ff | rgb(255, 0, 255) |
| magenta | #ff00ff | rgb(255, 0, 255) |
| rebeccapurple | #663399 | rgb(102, 51, 153) |
| gray | #808080 | rgb(128, 128, 128) |
| grey | #808080 | rgb(128, 128, 128) |
That means the chart is not just a 148-pixel swatch palette; it is also a glossary of every legal spelling. When you are reading a legacy stylesheet that uses aqua everywhere, you can confirm in one filter that aqua, cyan, and #00ffff are the same color. When you are writing new code, the chart helps you decide which spelling to standardize on for your team — typically the keyword that matches the surrounding codebase, not necessarily the one you happened to search for first.
A third kind of alias worth knowing about is rebeccapurple, which is the only name in the chart that was added in a non-historical context. It maps to #663399 (rgb(102, 51, 153)) and was standardized by CSS Color 4 in memory of Rebecca Alison Meyer. It sits in the chart alongside the rest, not as a duplicate of any existing purple, and is the easiest named-color answer to questions like "is there a dignified mid-purple keyword?"
Choosing Between a Named Color, HEX, and rgb() in CSS
The four CSS color formats serve different editorial needs, and picking one is a code-style decision rather than a rendering decision — browsers normalize all of them to the same sRGB triple. The comparison below summarizes when each format earns its keep.
| Format | Example | Best use |
|---|---|---|
| Named color | tomato | Readable prototypes, fixed design tokens, translating legacy stylesheets |
| Hexadecimal | #ff6347 | Compact source-of-truth values; the lowercase six-digit form is the most portable |
| rgb() | rgb(255, 99, 71) | When you already think in integer channels or are converting from image tooling |
| HSL / hsl() | hsl(9, 100%, 64%) | Perceptual adjustments — shifting hue or lightness without touching saturation |
The named-color layer is the smallest and most constrained of these, which is also its strength. Because the list is closed at 148 keywords, you can rely on a name like tomato meaning the same thing in every browser, in every stylesheet, on every device. That stability is what makes the HTML Color Names Chart a useful translation tool: if you know the name, you can confirm the value; if you know the value, you can confirm the name. For deeper reference, the MDN named-color page mirrors the same spec table with cross-browser compatibility notes.
Limits of the Named-Colors Reference
The chart is a lookup, not a generator, and it deliberately does not do a handful of things that are tempting to misuse it for. Knowing where the chart stops keeps it from being blamed for jobs it was never built to do.
Contrast and accessibility decisions are the most common misuse. A named color or a HEX value tells you a color's sRGB channels, but WCAG contrast depends on the foreground-background pair, the rendered text size, and the applicable guideline level — not on which keyword you chose. For that task, the Color Contrast Checker takes any two HEX or rgb() values and reports AA and AAA ratios in real time.
Palette generation is the next common misuse. The 148 named colors are not a perceptually even palette, so deriving a balanced scheme by eye from the chart will give uneven results. The Color Palette Generator is the right tool for that — pick any base HEX, including one copied from the chart, and it will compute balanced relationships across several standard schemes.
Print and CMYK conversion, gradient code, image sampling, random exploration, and converting between HEX and RGB are also separate tasks. Each of those jobs has a focused tool that handles it end to end. Use the HTML Color Names Chart when you need to translate, verify, or copy one of the 148 standardized opaque named-color keywords; reach for the focused tool when you need anything else.
For a deeper look, see What Details Matter When You Generate a CSS Checkbox.
For a deeper look, see Which Details Matter When You Generate a CSS Cubic Bezier.