Wind Chime

#dfe0e2

Softer warm-neutral gray with airy calm spacing

Save
Share

About Wind Chime

Wind Chime looks like the gray you get after daylight softens a concrete sidewalk, not like it's been dressed up for UI. It's lighter than Grain of , but it doesn't drift toward that almost-white, apologetic feel of . Compared to , it holds a steadier, more neutral temperature instead of leaning into a blue-tinged cool glow.

This is my go-to for surfaces that need to feel clean without disappearing. Think maintenance screens in healthcare portals, the card backs behind product tiles, and default panel fills in SaaS where you want hierarchy to show up in layout, not contrast tricks. I like it in dashboards and finance apps for table header strips, secondary chart areas, and modal backplates when you still want the UI to look calm next to both warmer and cooler grays. It's the one you reach for when you want a light gray that has enough body to read as its own layer.

Pair it with crisp whites or slightly warmer grays for edge definition; with very cool tones it can start to feel flatter than you expect.

Gradient preview

See how this color looks in an animated mesh gradient.

Conversions

Click any value to copy.

Need this programmatically? Color API

Code snippets

Copy this color into your project.

Contrast checker

WCAG 2.1 contrast ratios. AA requires 4.5:1 for normal text, 3:1 for large. AAA requires 7:1 / 4.5:1.

On White #ffffff

Aa
1.32:1Fail

On Gray 100 #f5f5f5

Aa
1.21:1Fail

On Gray 900 #18181b

Aa
13.41:1AAA

On Black #000000

Aa
15.90:1AAA

Variations

Shades

Darker variations, created by mixing toward black.

Tints

Lighter variations, created by mixing toward white.

Tones

Muted variations, created by reducing saturation.

Hues

Hue rotations around the color wheel.

Temperatures

Warm and cool shifts of this color.

Color harmonies

Complementary
Analogous
Triadic
Split Complementary
Tetradic

Suggested palettes

Palettes built around this color.

4 colors
3 colors
4 colors
4 colors

Community palettes

Published palettes that include this color.

Similar colors

#e1dfe1
#e1e1e2
#dce3e4

Create a gradient with Wind Chime

Open the generator with this color pre-loaded.

Start creating