Oceanic Motion
#1d5c83
Brighter ocean blue for clear section separation
About Oceanic Motion
I keep thinking of Oceanic Motion as the blue you get after staring at a map in daylight, not a dark screen at night. It's medium-dark, but it doesn't feel heavy like Dark Blue or tucked-in like Blue Velvet. The undertone stays distinctly blue, with a calmer, slightly softened coolness that reads cleaner than the deeper, more assertive Beyond the Sea.
On product surfaces, that means it holds hierarchy without looking like it's pressing forward. I use it for dashboards and finance apps where you want a primary action, active states, and key data highlights to stay legible on light layouts. It also shows up well in healthcare UI patterns for panels and emphasis rows because it feels steady, not austere.
If you pair it with grays, avoid going too neutral too fast. A touch of crisp white or a warm off-white keeps the one you reach for from looking flat, especially on large chart backgrounds.
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.