Color Directory
Filters use each color's real HSL values — light means lightness ≥ 70%, dark ≤ 35%, pastel combines high lightness with soft saturation, vivid needs strong saturation at readable lightness, and web safe means every RGB channel is a multiple of 51.
Blues
Cool, calming hues widely used in tech and corporate branding.
Greens
Hues associated with nature, growth, and balance.
Neutrals
Grays, browns, and near-black or near-white tones used as a design foundation.
Oranges
Vibrant hues between red and yellow, often used for calls to action.
Pinks
Soft to vivid hues associated with warmth and playfulness.
Purples
Hues blending the energy of red with the calm of blue.
Reds
Warm, high-energy hues ranging from soft rose to deep crimson.
How this directory works
How the families are grouped
Families aren't assigned by opinion — they're computed from each color's real HSL values. Hue decides the family (reds live within 15° of the wheel's origin, oranges up to 45°, and so on around to pinks), with one exception: anything with very low saturation reads as gray regardless of hue, so it lands in Neutrals. That's why a murky blue-gray sits beside beige rather than beside the blues.
Where the names come from
Most standard names predate the web — they were inherited from the X11 window system's 1980s color list, quirks and all, which is how Papaya Whip and Dodger Blue became official CSS. Only one name was added for purely human reasons: Rebecca Purple, added in 2014 in memory of web pioneer Eric Meyer's daughter. The full standardized list lives on the CSS color names page.
Named colors vs. HEX in practice
tomato
and #ff6347
are the same color to the browser — there's no rendering or speed difference. Names win on
readability in quick prototypes; HEX wins everywhere else, because design systems need the
16.7 million colors names can't cover. When a color you love has no name, its
Delta E-nearest
named neighbor is shown right on its page.
Frequently asked questions
The directory currently catalogs 141+ colors: every standard CSS color keyword plus curated classics. But it isn't a wall — any of the 16.7 million possible hex values gets the same full page (conversions, harmonies, accessibility data) the moment you visit /color/ followed by its code.
The CSS Working Group standardizes them in the CSS Color specification. The bulk of the list was inherited from the X11 window system's color list from the 1980s; the only modern addition is rebeccapurple, added in 2014 as a memorial.
Yes — the standard named colors are among the oldest features of CSS and work in every browser, including very old ones. There is no compatibility reason to avoid them.
No. The browser resolves both to the same internal value at parse time, so there is no rendering or performance difference whatsoever. The choice is purely about readability and precision.
They read each color's real HSL values, not hand-applied tags: Light means lightness of 70% or more, Dark means 35% or less, Pastel combines high lightness with gentle saturation, Vivid requires strong saturation at mid-range lightness, and Web safe means every RGB channel is a multiple of 51 — the classic 216-color palette.
Can't find the exact shade?
Every hex code has a full page — pick one visually, or extract it straight from an image.