Gray Colors
111 gray colors in the library, 52 of them carrying a registered name. Every swatch opens a full breakdown: hex, RGB, HSL, HSV, CMYK, LAB and OKLCH values, WCAG contrast, harmonies, tints and shades.
A grey is any colour whose red, green and blue channels are close enough together that no hue survives — in practice under about 10% saturation. Pure greys are rare in good interface design: most production greys carry a few degrees of the brand hue so that text, borders and backgrounds feel part of one system rather than dropped in from a stock palette.
Named Gray Colors
The grays that carry a published name, from the CSS keywords through the paint and print registries. These are the ones worth referring to by name in a brief, because the person reading it can look them up.
- Aluminium#A9ACB6
- Ash Gray#B2BEB5
- Battleship Gray#848482
- Black Olive#3B3C36
- Blue-gray (Crayola)#C8C8CD
- Dark Gray#A9A9A9
- Dark Liver#534B4F
- Davy's Gray#555555
- Dim Gray#696969
- Ebony#555D50
- Feldgrau#4D5D53
- Granite Gray#676767
- Graphite#41424C
- Gray#808080
- Gray (X11)#BEBEBE
- Iron Gray#555D61
- Jet#343434
- Light Gray#D3D3D3
- Light Silver#D8D8D8
- Metallic Silver#A8A9AD
- Middle Gray#8B8680
- Mummy's Tomb#828E84
- Neon Silver#CCCCCC
- Nickel#727472
- Old Lavender#796878
- Onyx#353839
- Outer Space#414A4C
- Pewter#899499
- Philippine Gray#8C8C8C
- Philippine Silver#B3B3B3
- Quartz#51484F
- Quick Silver#A6A6A6
- Rocket Metallic#8A7F80
- Roman Silver#838996
- Silver#C0C0C0
- Silver (Metallic)#AAA9AD
- Silver Chalice#ACACAC
- Silver Foil#AFB1AE
- Silver Sand#BFC1C2
- Smoke#738276
- Sonic Silver#757575
- Spanish Gray#989898
- Steel#71797E
- Taupe Gray#8B8589
- Titanium#878681
- Traffic Black#2A2D2F
- Traffic Gray a#8F9695
- Traffic Gray B#4E5451
- Xanadu#738678
- Xumo#413639
- Zinc Gray#655B55
- Zircon Gray#807473
Every Gray by Lightness
The full gray range grouped from darkest to lightest. Lightness is the L in HSL — the fastest way to find a gray that will hold up as a background, a border, or body text against the rest of your palette.
Dark · 20-40% lightness · 33 colors
Mid-tone · 40-60% lightness · 33 colors
Light · 60-80% lightness · 29 colors
Browse Another Family
Working with Gray
For the editorial guide — what gray signals, where it works, and what to pair it with — read shades of gray. To find a gray by name rather than by eye, use the A-Z index of color names. To build a palette around one, open any swatch and use the palette generator or check it in the contrast checker.