CSS Named Colors
All 148 CSS Color Module Level 4 named colors with swatches, hex values, RGB, HSL, and live click-to-copy. Sort by hue, lightness, or name; filter by search term or hex prefix.
How to Use
- Search by name (red, salmon, cornflowerblue…) or hex (ff or #cd5c).
- Sort by hue (the rainbow), lightness, or alphabetical.
- Click any swatch to copy its name. Shift-click to copy its hex.
About CSS named colors
About the CSS Named Colors
The CSS Named Colors gives you a fast, free answer for colour and design work without sending anything off your device. All 148 CSS Color Module Level 4 named colors with swatches, hex values, RGB, HSL, and live click-to-copy. Sort by hue, lightness, or name; filter by search term or hex prefix.
How it works
Everything is laid out so you can find what you need fast. There are no long tables to dig through. The page also works without internet once it has loaded, so you can use it anywhere.
Want the deeper story? The Knowledge Base explains the ideas behind the tools in more detail.
Frequently Asked Questions
How many CSS named colors are there?
148 (per CSS Color Module Level 4). Some have aliases (gray/grey, aqua/cyan, fuchsia/magenta).
When should I use them?
Demos, mockups, code samples, debugging. For production design systems, use semantic tokens (--color-primary) backed by a chosen palette.
Which ones are legacy?
The 16 HTML 4 colors — aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow. Everything else came from X11 / SVG / CSS3 extensions.
Why is rebeccapurple special?
Added to CSS Color Module Level 4 in 2014 in memory of Rebecca Meyer, daughter of CSS pioneer Eric Meyer. It is hex #663399.
How do I use the CSS Named Colors?
Simply type your numbers and read the result, which refreshes the instant you change something. There is nothing to submit and nothing to wait for.
Does it cost anything or need an account?
No. The tool is completely free, there is no account to create, and it keeps working offline after the page first loads.
Is anything I type uploaded?
No. The tool works entirely on your device, so the values you enter never leave your browser.
Common Use Cases
Quick prototyping
Grab a named color while sketching ideas in code.
CSS reference
Look up the hex of a name or vice versa instantly.
Palette inspiration
Browse the spectrum by hue to spot pairings.
Last updated: