Light Blue
#add8e6
Higher, cooler tint for crisp header and cards
About Light Blue
I keep seeing this shade show up on the header of a well-made signup form, where the page needs to feel airy but still clearly blue. Light Blue lands as warmer than the ice-pale near-whites in the family, so it doesn't disappear, and it reads steadier than the more muted "almost veil" look.
Compared to Lady-In-Waiting, it's a touch cleaner and less obviously saturated, so it feels lighter without turning chalky. Versus Distant Homeworld, it gives up some of that cyan-leaning punch, staying more softly blue than it is visibly warm. I use it as the go-to the one you reach for background in dashboards and finance apps, especially behind cards, tables, and empty-state panels where you want calm that still feels intentional.
Quirk: on screens that run cool, it can look slightly grayer. If your typography shifts, nudge toward gray-based text and you'll keep the whole UI coherent with less fuss.
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.