Color Encyclopedia
Explore all 141 CSS named colors across 14 categories. Click any color for detailed information including HEX, RGB, HSL values, tints & shades, complementary palettes, contrast recommendations, and ready-to-use CSS code.
Red (8)
Pink (10)
Purple (14)
Blue (19)
Cyan (3)
Teal (9)
Green (15)
Yellow (11)
Orange (14)
Brown (11)
White (13)
Gray (9)
Black (1)
CSS Named Colors — Complete Reference
CSS named colors are predefined color keywords that can be used directly in stylesheets without needing hex codes or RGB values. The CSS Color Module Level 4 specification defines 148 named colors, ranging from common colors like "red" and "blue" to more specialized names like "blanchedalmond" and "rebeccapurple".
Our color encyclopedia goes beyond the 148 CSS spec colors — we include additional well-known web colors and organize them into 14 intuitive categories: Red, Pink, Purple, Blue, Cyan, Teal, Green, Lime, Yellow, Orange, Brown, White, Gray, and Black. Each color has its own dedicated page with comprehensive information.
On each color page you'll find: HEX, RGB, and HSL values with one-click copy; tints and shades for creating monochromatic palettes; complementary and analogous color schemes; WCAG contrast ratio checks against black and white; ready-to-use CSS code snippets; and links to related tools like the Color Picker, Palette Generator, and Contrast Checker.
Whether you're a web designer building a brand palette, a developer implementing a design system, or a student learning color theory, this encyclopedia gives you everything you need to work confidently with CSS colors.
Frequently Asked Questions
How many CSS named colors are there?
The CSS Color Module Level 4 specification defines 148 named colors. Our encyclopedia includes these plus additional well-known web colors, organized into 14 intuitive categories for easy browsing.
What information is on each color page?
Each color page includes: HEX, RGB, and HSL values with copy buttons; tints and shades (9-step monochromatic scale); complementary and analogous color palettes; WCAG contrast ratio checks against black and white text; ready-to-use CSS code snippets; use cases and design recommendations; and links to related tools.
How are the colors organized?
Colors are grouped into 14 categories: Red, Pink, Purple, Blue, Cyan, Teal, Green, Lime, Yellow, Orange, Brown, White, Gray, and Black. This categorization helps you quickly find colors with similar hues when building your color palette.
Can I use named colors in production CSS?
Yes, CSS named colors are fully supported in all modern browsers. However, for brand colors and precise design requirements, most teams use hex codes. Named colors are excellent for prototyping, documentation, and quick styling.