Loading...

Shades of Gray

23 named gray shades with hex codes — click any swatch to copy.

Find Closest Gray Shade

Enter any hex code to find the nearest named gray shade.

Gray is the workhorse of design — versatile, neutral, and endlessly adaptable. Pale grays and off-whites feel clean and modern; mid-range silvers add elegance and tech-forward appeal; deep charcoals and slate grays provide a sophisticated alternative to pure black. Gray pairs with every color on the spectrum.

All Gray Shades

White

#FFFFFF

Ghost White

#F8F8FF

Ivory

#FFFFF0

White Smoke

#F5F5F5

Seashell

#FFF5EE

Floral White

#FFFAF0

Off White

#FAF9F6

Gainsboro

#DCDCDC

Light Gray

#D3D3D3

Silver

#C0C0C0

Dark Gray

#A9A9A9

Gray

#808080

Dim Gray

#696969

Slate Gray

#708090

Light Slate Gray

#778899

Ash Gray

#B2BEB5

Pewter

#96A8A1

Charcoal

#36454F

Dark Slate Gray

#2F4F4F

Gunmetal

#2A3439

Onyx

#353839

Jet Black

#0A0A0A

Black

#000000

Using Gray Shades in Design

Light shades

Pale gray shades make excellent backgrounds, hover states, and subtle accents. They keep designs airy without losing the hue's personality.

Mid-range shades

The middle of the gray spectrum is where most UI elements live — buttons, icons, links, and borders. These shades are vivid enough to pop without overwhelming.

Dark shades

Deep gray shades work for text on light backgrounds, dark mode surfaces, and dramatic hero sections. They're rich and authoritative.

Building a palette

Pick one gray shade as your primary, one light variant for backgrounds, and one dark variant for depth. Add a neutral gray for balance.

Related Color Families