Cocoon

#dedbcc

Cocoon-gray cool-linen calm with lower warmth

Save
Share

About Cocoon

Cocoon sits noticeably lighter than and , but it's not trying to be either. There's enough warmth to keep it from reading purely neutral, but it stops short of the creaminess that makes the others feel intentional about their temperature. It's the kind of shade that reads as restraint, not as a color choice, which is exactly the point.

Use this in editorial layouts, light interfaces, and publishing platforms where you need something between white and gray without the warmth becoming the story. It works particularly well as a reading background or a subtle container color in dashboards because the lightness doesn't tire the eye, but the undertone keeps the space from feeling sterile. Type sits on it with clean contrast. It doesn't compete with photography.

The difference that matters: pair it with warm accents and it stays quiet. Pair it with cool blacks or desaturated colors and there's no temperature tension the way there is with . It's less fussy about what comes next, which makes it easier to live with across different screen conditions and lighting situations.

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.39:1Fail

On Gray 100 #f5f5f5

Aa
1.27:1Fail

On Gray 900 #18181b

Aa
12.75:1AAA

On Black #000000

Aa
15.11: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

Create a gradient with Cocoon

Open the generator with this color pre-loaded.

Start creating