Copy the keyword
Use the Name button when readable CSS examples or quick prototypes benefit from a familiar color name.
CSS named colors
Search the CSS color keyword set.
Search CSS named colors by keyword, HEX value, RGB value, or group. Hue Codex separates the 148 fixed opaque named colors from transparent, currentcolor, and current system color keywords, then lets you sort by name, hue, or lightness and copy the values you need for CSS, docs, color roles, and review notes.
Free color utility
Named Colors
Inputs update live, exports are copy-ready, and the color math stays deterministic.
Reference
Named color search
Instructions
- Search by CSS color name or HEX value to narrow the named color list.
- Sort results by name, hue, or lightness depending on how you want to scan the colors.
- Use the group filter to switch between all keywords, opaque colors, special keywords, and system colors.
- Review the summary and color cards, then copy the named color values for CSS or documentation.
How it fits
From color value to usable system.
Hue Codex treats each color as part of a larger workflow: conversion, accessibility, palette roles, CSS syntax, shareable URLs, and production exports.
Deterministic math
Color conversion follows CSS Color 4 conventions, including D50 Lab/LCH, D65 OKLab/OKLCH, and WCAG contrast thresholds.
Readable outputs
Every result is formatted for clear reading, project notes, documentation, and assistive technology.
Free sharing
Palette URLs can be bookmarked and sent without an account, making color decisions easy to revisit.
Quick overview
Hue Codex CSS Named Colors Reference is a free browser-based table for searching CSS color keywords. It includes 148 opaque named colors with fixed sRGB HEX and RGB values, plus transparent, currentcolor, and 19 current system color keywords as separate groups because their value behavior differs.
- The fixed named-color table has 148 opaque sRGB colors, including aliases such as aqua/cyan, fuchsia/magenta, and gray/grey.
- transparent is a named-color value, but it is transparent black rather than an opaque HEX color.
- currentcolor and system colors are valid CSS color keywords, but their actual used color depends on context.
- Use search, group filters, and name/hue/lightness sorting to find practical keyword values quickly.
- Copy names for readable CSS examples, or copy HEX/RGB values when fixed color values are easier to document.
What the Hue Codex CSS named colors reference does
The Hue Codex CSS named colors reference lets you search, filter, sort, inspect, and copy CSS color keywords. Opaque named colors appear as swatches with their CSS keyword, fixed HEX value, RGB value, and HSL hue/lightness detail.
The page also separates special keywords and system colors from fixed named colors. That distinction matters because transparent, currentcolor, and system color keywords do not behave like ordinary opaque swatches.
CSS named colors definition
CSS named colors are standardized color keywords such as rebeccapurple, tomato, black, white, cyan, and gray that can be used anywhere CSS accepts a color value.
CSS color keyword groups
Hue Codex groups CSS color keywords by value behavior. Fixed opaque named colors can be copied as a keyword, HEX, or RGB value. Special and system keywords are useful CSS values, but they depend on transparency, inherited context, or platform color settings.
| Group | Count | Value behavior |
|---|---|---|
| Opaque named colors | 148 | Fixed sRGB keyword-to-HEX mappings. |
| Special keywords | 2 | transparent resolves to transparent black; currentcolor resolves from the element color property. |
| System colors | 19 | Resolve from browser, OS, theme, or forced-colors context. |
How to search, sort, and copy named colors
Search accepts CSS names, display names, HEX values, RGB values, groups, and descriptions. For example, blue can find blue-family names, #663399 can find rebeccapurple, and system can narrow to dynamic system color keywords.
Sorting by hue helps browse the fixed swatches like a color wheel. Sorting by lightness helps find light neutrals, dark accents, or mid-tone colors. The export panel always follows the current search, group, and sort result.
Copy HEX or RGB
Use fixed HEX or RGB values when a color role, handoff note, or comparison table needs the numeric sRGB value.
Filter keyword groups
Switch between all keywords, opaque named colors, special keywords, and system colors to avoid mixing fixed and dynamic values by accident.
Best uses for CSS named colors
Named colors are useful for learning, quick examples, test cases, prototypes, and readable documentation. They are also helpful when you need a familiar reference point before choosing a final role value.
- Look up the exact HEX and RGB value behind a CSS color name.
- Find aliases such as cyan/aqua, magenta/fuchsia, gray/grey, and darkgray/darkgrey.
- Sort by hue or lightness when comparing named colors for examples, demos, or palette notes.
- Copy fixed keyword values for CSS snippets, documentation, QA comments, and tutorials.
- Review transparent, currentcolor, and system color keywords separately from fixed sRGB named colors.
Named color caveats
CSS named colors are convenient, but design systems usually benefit from semantic roles such as --color-text, --color-surface, or --color-danger rather than raw names like tomato or dodgerblue. A role describes the job of a color; a named color describes only a fixed value.
System colors and currentcolor are context-dependent. They can be powerful for accessibility-aware interfaces, especially with forced-colors mode, but they should be tested in the real browser and OS settings where they will appear.
Use named colors as reliable CSS keyword references, then check contrast, role naming, fit, and context-dependent behavior before publishing a final interface.
Quick answers
Named Colors FAQ
What is the Hue Codex CSS named colors reference?
Hue Codex CSS Named Colors Reference is a free browser-based table for searching, filtering, sorting, and copying CSS color keywords, including fixed named colors, transparent, currentcolor, and system colors.
How many fixed CSS named colors are there?
CSS Color Module Level 4 defines 148 opaque named colors with fixed sRGB values.
What is the difference between CSS named colors and CSS color keywords?
Opaque named colors are fixed sRGB keywords such as tomato or rebeccapurple. CSS color keywords also include special and system keywords such as transparent, currentcolor, Canvas, and Highlight.
Is transparent a CSS named color?
Yes. CSS Color 4 defines transparent as a named-color value, specifically transparent black with zero alpha rather than an opaque swatch.
What does currentcolor mean in CSS?
currentcolor is a CSS keyword that resolves to the computed value of the element color property, making it useful for borders, icons, outlines, and inherited color behavior.
Are system colors the same as named colors?
No. System colors are CSS color keywords, but their used values are dynamic and can reflect browser, operating system, theme, or forced-colors settings.
Can I copy CSS named color values?
Yes. The tool lets you copy CSS keyword names, fixed HEX values, RGB values, and the currently filtered export list.
Should CSS use named colors or color roles?
Named colors are fine for examples, prototypes, and simple CSS, but larger interfaces usually benefit from semantic color roles that describe the job of each color.