CSS Named Colors
Browse all 148 CSS named colors with their HEX and RGB values.
Quick Filters:
Total Colors: 148Matches: 148Filter: All
Using CSS named colors
CSS ships with 148 named colors — keywords like tomato, rebeccapurple, and cornflowerblue — that you can drop straight into a stylesheet without a hex code. They are handy for quick prototypes and readable defaults. Click any swatch to copy its hex value; the RGB equivalent is shown for when you need an rgb() or rgba() value.
Need a specific shade? Convert with the color converter, build a palette with the color shades generator, or check legibility with the contrast checker.
Built and maintained by Meet Shah · Last updated
What this tool is used for
- Browsing the named colours to find one close to what you want.
- Checking a named colour's hex value before hard-coding either form.
- Choosing a quick placeholder colour during development.
- Confirming which name a colour value corresponds to.
- Comparing similarly named colours side by side.
Frequently Asked Questions
- How many named colours are there?
- 148, including
transparentand the CSS-wide keywords' companions. The list is fixed by the specification, so a name outside it is invalid and the declaration is simply dropped. - Why are the names so inconsistent?
- Because they accumulated from the X11 window system rather than being designed. That is why there are four near-identical greys, why
darkgrayis lighter thangray, and why several names describe nothing recognisable. - Do the British spellings work?
- Yes —
greyandgrayare both accepted, as are the compounds such asdarkgrey. They map to identical values, so the choice is purely stylistic. - Should I use named colours in production?
- For quick prototypes and debugging, they are convenient. A real design system needs values that fit its palette, and named colours are a fixed set nobody chose for your brand.
- Is
transparenta colour? - It is a keyword equivalent to
rgba(0, 0, 0, 0)— fully transparent black. That matters for gradients, where interpolating totransparentcan pass through grey unless you specify a transparent version of the same hue.
Common errors and gotchas
- Assuming the named colours form a coherent palette, when they are a historical accident.
- Assuming a name is memorable enough to use without checking, when several are counter-intuitive.
- Using a named colour in a brand context where the exact value matters.
- Assuming
greyandgraydiffer, when both spellings map to the same value. - Relying on a name being intuitive, since several are nothing like their name suggests.
Related Design & CSS tools
Color Converter
Convert a color to HEX, RGB, HSL, HSB, and CMYK at once.
HEX to RGB
Convert HEX color codes to RGB / RGBA values.
RGB to HEX
Convert RGB values into HEX color codes.
CSS Box Shadow Generator
Visually design CSS box-shadow with a live preview and code.
CSS Border Radius Generator
Visually craft border-radius with a live preview.
HEX to CMYK
Convert HEX colors to CMYK print values.
CMYK to HEX
Convert CMYK print values to HEX colors.
HEX to HSB
Convert HEX colors to HSB / HSV values.