Way Beyond the Blue
#1188cc
Brighter, high-saturation blue for standout highlights
About Way Beyond the Blue
Way Beyond the Blue looks like a bright, clear sky-blue panel laid over a white header, not a deep ocean tone. Compared to the nearby interface blues you've been using, it's lighter and more saturated, so it reads crisp instead of soft. Forget-Me-Not and Mermaid Dreams feel more "in-between," while this one pushes further out toward punchy clarity. It has that cooler, slightly distant feel that makes it feel fast, not friendly.
I'd use it for primary actions in healthcare platforms, fintech flows, and SaaS dashboards where you want the button to pop without turning icy. It's also great for link accents and status badges in long, data-heavy screens, because the lightness stays legible even when the rest of the UI gets busy. If King Triton is the weighted pick for hierarchy, this is the one you reach for when you need urgency with clean edges, not authority with depth.
Pair it with cool grays and true neutrals. Next to warmer blues it can start to look a little more assertive than you planned.
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.
Similar colors
Create a gradient with Way Beyond the Blue
Open the generator with this color pre-loaded.
Start creating