Breezy
#c2dde6
Airy sky-blue with gentler gray undertone
About Breezy
Breezy splits the difference between Cotton Clouds and Breaking the Ice in a way that matters. It's cooler and slightly more saturated than Cotton Clouds, so it doesn't drift toward warmth. But it's also less fussy than Breaking the Ice, cleaner lines, less of that sky-fabric thing happening. The kind of blue that reads as deliberate without announcing itself.
You'll land here in product dashboards, settings pages, and health app interfaces where you need a secondary surface that doesn't feel like you're working on a blank canvas. It works in fintech onboarding too, anywhere you're layering UI and need something that breathes but holds color. The lightness keeps it approachable; the saturation keeps it from disappearing into the monitor's white point.
Pair it with charcoal or dark slate and it stays crisp. Don't wrestle it into warm neutrals, that's when it'll feel slightly off. It's the one you reach for when the paler options start dropping out across different screens.
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.