Honolulu Blue
#007fbf
Balanced medium blue for calm, crisp UI
About Honolulu Blue
I keep seeing Honolulu Blue show up as that clean sea-sky blue on product screens where the design still needs to feel calm. Compared to Haddock's Sweater, it's brighter and more open, so it doesn't feel as settled or weighty. And unlike Forget-Me-Not, it holds onto more saturation, so it stays assertive without drifting into the softer helper lane.
This shade is my go-to when I want dashboards and finance apps to read confident but not aggressive. It lands well for primary CTAs, active states, and chart accents in fintech, logistics portals, and consumer banking flows. Relative to Brilliant Blue, it's a touch lighter and less dense, so it feels warmer than the darker blues while still staying decisively blue on white and against mid-tone grays.
One quirk: on very dark backgrounds it can look a little airy, so I'll pair it with deeper navy or neutral text to keep the hierarchy tight. Pairing it with cool teals works too, but go easy on desaturated blues nearby or it all starts to blur.
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.