Loading…

How to use CSS Color Names Reference

Scroll or search the table of named colors and click any swatch to copy either the color name or its hex value.

Frequently asked questions

How many CSS named colors are there?

There are 148 standard CSS named colors, including duplicates like gray and grey and aqua and cyan.

Can I use these names directly in CSS?

Yes — write color: tomato or background: rebeccapurple and the browser resolves the name to its hex value.

What is rebeccapurple?

A named color (#663399) added to CSS in memory of Eric Meyer's daughter Rebecca; it is part of the standard list.

More Color Tools

Tailwind Color Finder
Browse and copy the complete Tailwind CSS color palette
Color Distance Calculator
Measure perceptual color difference using the ΔECIEDE2000 metric
Color Temperature Tool
Visualize warm/cool color temperature and generate palettes
HEX to RGBA Converter
Convert HEX colors to rgba() with custom alpha / opacity
Color Palette Sorter
Sort a list of hex colors by hue, saturation, or lightness
UI Color Scheme Builder
Build a complete UI color scheme with semantic role assignment
Contrast Grid Checker
Check WCAG contrast for every foreground/background pair in a palette at once
OKLCH Color Converter
Convert HEX/RGB to and from OKLCH and OKLab (CSS Color 4)
Material Tonal Palette
Generate a 50–900 tonal scale from one base color for design systems
Complementary Color Finder
Find the exact complementary (opposite) color for any hex value
Color Inverter
Invert any color to its RGB negative (255 minus each channel)
Lighten / Darken Color
Lighten or darken any color by a precise percentage of lightness

← View all Color ToolsBrowse all 1,100+ tools →