Icebreaker
#b7c2cc
Cool, desaturated light gray with calm neutrality
About Icebreaker
Icebreaker looks like the gray you'd see on the inside of a clean refrigerator door: cool, airy, and just a touch bluish, but without the heavier "blue punch" of Arctic Ice. It's lighter and less saturated, so it reads smoother and more forgiving under bright UI glare. Compared to Ethereal Mist, it doesn't drift toward lavender softness, and it keeps a firmer neutral edge.
I use Icebreaker for secondary surfaces where you want deliberate calm: card backgrounds, input fields, and disabled states in dashboards and healthcare platforms. In fintech screens, it's a solid choice for form sections and panel separation because the blue-neutral undertone stays composed with both cool and neutral palettes. It also gives you a better hierarchy break than Foil when you need "not quite white" but still crisp.
The quirk: pair it with anything warm and the temperature difference shows fast, so let warm accents be deliberate rather than incidental.
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
On Gray 100 #f5f5f5
On Gray 900 #18181b
On Black #000000
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
Suggested palettes
Palettes built around this color.
Community palettes
Published palettes that include this color.