Back to palettes

Palette

Deep Ocean Current

A mesmerizing collection of deep blues, mirroring the profound and enigmatic currents of the ocean.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Deep Ocean Current reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Deep Ocean Current.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#0B1C2A#1C384B#2E566C#4A7A96#74A2C0

Palette guide

How to use Deep Ocean Current

Overview

The Deep Ocean Current palette offers a serene and cohesive collection of cool blues, perfectly mirroring the calm and profound flow of the ocean. It begins with the very dark #0B1C2A, building through #1C384B and #2E566C to establish a sense of deep, tranquil progression. The palette then gently transitions to the softer #4A7A96 and the airy #74A2C0, introducing clarity and a refreshing touch. This collection is ideal for designers and developers seeking a tranquil, professional, and trustworthy aesthetic, excellently suited for corporate identities, environmental themes, or calm user interfaces that inspire confidence.

Best used for

  • Corporate websites and professional services
  • Environmental organizations and sustainability reports
  • Educational software and e-learning platforms
  • Calm UI/UX design for productivity apps
  • Professional presentations and annual reports
  • Digital dashboards requiring a focused, serene feel

Suggested color roles

primary

Use #0B1C2A as the stable, professional base for backgrounds or main structural elements, conveying gravitas.

secondary

Employ #1C384B for secondary content sections, navigation, or large UI components, providing depth and support.

accent

Apply #74A2C0 for light, refreshing highlights, interactive elements, or key information to ensure clarity.

background

The deep #0B1C2A works well for a calming dark mode. For a lighter, airy background, #74A2C0 can be used with darker text.

text

For optimal readability on dark backgrounds like #0B1C2A or #1C384B, use white or a light grey. On lighter backgrounds like #74A2C0, use #0B1C2A or dark charcoal.

Accessibility notes

  • White or light grey text provides excellent contrast against #0B1C2A and #1C384B backgrounds, ensuring readability.
  • When using #74A2C0 as a background, pair it with a dark text color such as #0B1C2A to meet WCAG AA standards.
  • Avoid using #4A7A96 for small text on #2E566C backgrounds due to potential luminance similarity, hindering legibility.
  • Always test all text-background pairings and interactive elements for sufficient contrast across various display settings.

Recommended combinations

Gradual Flow

Creates a smooth visual journey, ideal for progressive content, multi-step forms, or storytelling elements.

#0B1C2A · #2E566C · #74A2C0

Deep & Muted

Perfect for subtle gradients, textured backgrounds, or layered elements that require understated depth.

#1C384B · #2E566C · #4A7A96

Core Harmony

Forms a strong core identity, suitable for main branding elements, primary UI components, and clear accents.

#0B1C2A · #1C384B · #74A2C0

CSS variables

:root {
  --deep-ocean-current-2-1: #0B1C2A;
  --deep-ocean-current-2-2: #1C384B;
  --deep-ocean-current-2-3: #2E566C;
  --deep-ocean-current-2-4: #4A7A96;
  --deep-ocean-current-2-5: #74A2C0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-ocean-current-2": {
        1: "#0B1C2A",
        2: "#1C384B",
        3: "#2E566C",
        4: "#4A7A96",
        5: "#74A2C0",
      }
    }
  }
}

Related searches

calm blue color schemeprofessional ocean palettetranquil web designcool blue corporate identitydeep marine UI

Palette colors

Hex values

Color 1#0B1C2A
·
Color 2#1C384B
·
Color 3#2E566C
·
Color 4#4A7A96
·
Color 5#74A2C0
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2.2:1Fail
3.7:1AA18
6.3:1AA
2
1.4:1Fail
1.6:1Fail
2.6:1Fail
4.5:1AA18
3
2.2:1Fail
1.6:1Fail
1.7:1Fail
2.9:1Fail
4
3.7:1AA18
2.6:1Fail
1.7:1Fail
1.7:1Fail
5
6.3:1AA
4.5:1AA18
2.9:1Fail
1.7:1Fail

Similar palettes

More like Deep Ocean Current

View all cool
Azure Ocean Current
Coral Abyss Dive
Ocean Depths Glimmer
Oceanic Abyss Deep
Sapphire Grotto Shimmer
Abyssal Blue Descent