New Heights
#d0e5f2
Heavier light gray-blue for structured, calm panels
About New Heights
I keep noticing New Heights in quiet UI mocks: it looks like a pale sky-gray that's been softened, not cooled. Compared to Freezing Vapour's almost invisible blue hush and Ethereal Moonlight's near-total fade, this one holds its shape more clearly. And unlike Celestial Cathedral, it doesn't commit to an obvious blue tilt, so it feels more neutral at first glance.
At the size of panels and form surfaces, that means it reads as clean separation without making the background feel "picked over." I use it for dashboards and finance apps where you want the one you reach for when the layout needs calm structure. It's also a good fit for healthcare admin screens, onboarding steps, and editorial sidebars that sit next to content without stealing attention.
Pair it with darker grays and you'll get crisp hierarchy. Let warm accents lead and it stays steady, but it won't swing as far into warmth as those grayer neighbors that are more forgiving.
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.