How This CSS Color Names Tool Works
How many css color names are there? 148, per the CSS Color Module Level 4 spec, and this css color names tool, also searched as an html color names tool since the same keywords work in both languages, covers four modes at once: search across all 148 css color names by typing part of a name or a hex value, convert a color name to hex by typing the name directly, convert hex to color name by pasting any hex value, or browse the full css color names list filtered as you type. Name lookups are case-insensitive and ignore spaces, so "Cornflower Blue" and "cornflowerblue" both resolve the same way, and a hex value works with or without the leading #.
How Many CSS Color Names Are There?
This tool's css color names list, laid out as a css named colors chart in the table below, has 148 entries, but only 139 of them are unique colors, the rest are spelling aliases that both resolve to the exact same hex value. CSS has supported both American and British spellings since the original specification, so gray and grey, and every color built on them like darkslategray and darkslategrey, always share one hex code rather than being two different shades. A handful of named colors css inherited from an older standard are aliases for an unrelated reason: aqua and cyan, and magenta and fuchsia, were both included when CSS's named colors were unified with the X11 color list, which already had its own name for the same RGB value.
| Name | Alias | Shared hex |
|---|---|---|
| gray | grey | #808080 |
| darkgray | darkgrey | #A9A9A9 |
| darkslategray | darkslategrey | #2F4F4F |
| dimgray | dimgrey | #696969 |
| lightgray | lightgrey | #D3D3D3 |
| lightslategray | lightslategrey | #778899 |
| slategray | slategrey | #708090 |
| aqua | cyan | #00FFFF |
| fuchsia | magenta | #FF00FF |
Finding the Nearest Named Color
To find color name from hex when there's no exact match among the 148 named colors, this tool falls back to finding the nearest named color instead of just returning nothing. It measures the straight-line distance between the input color and every named color in RGB space (treating red, green, and blue as three axes of a cube) and returns the five closest matches ranked by distance, so pasting a hex value from a design tool still gets you a usable, readable name even when it isn't one of the 148 exactly.
Common Uses
Looking up the hex value behind a css color names list entry while writing CSS by hand, converting a hex code copied from a design tool into a readable name for more self-documenting code, and checking whether two named colors like teal and darkcyan are actually different shades or just aliases are the most common uses. Debugging older or inherited CSS that uses named colors instead of hex, and learning or teaching the full set of css color keywords, are common secondary uses.
What This Tool Doesn't Do
This tool only covers the 148 standard css color names from the CSS specification, it doesn't include framework-specific palettes like Tailwind's or Material Design's named colors, which use entirely different naming systems. It also doesn't convert between hex, RGB, HSL, or other color formats directly, for that use the color converter. Nearest-match results use plain RGB distance rather than a perceptual color difference formula like CIEDE2000, so in rare cases a mathematically closer match may look slightly less similar to the human eye than a slightly farther one.