Back to palettes

Palette

Celestial Ocean Depth

Profound and rich blues capturing the enigmatic beauty of the ocean's deepest, unexplored realms.

Darkdark5 colors
More Dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Celestial Ocean Depth 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 Celestial Ocean Depth.

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

Data visualization

#003060#005B9A#007BA7#002040#104E8B

Palette guide

How to use Celestial Ocean Depth

Overview

This Celestial Ocean Depth palette is a profound and rich collection of deep blues, capturing the enigmatic beauty of the ocean's most unexplored realms. Ranging from the almost black #002040 to the vibrant #007BA7, these hex codes offer a powerful sense of depth and mystery. The harmonious progression through #003060 and #005B9A allows for subtle layering and sophisticated visual effects. Designers can leverage this palette to create immersive, professional, and slightly mysterious interfaces, while developers will find these distinct blue shades perfect for crafting elegant dark themes or sophisticated data visualizations.

Best used for

  • Marine research or oceanography websites
  • High-tech corporate branding
  • Luxury resort or travel agencies (focused on water)
  • Documentary film branding (especially nature/science)
  • Professional data dashboards
  • Elegant dark mode themes for business applications

Suggested color roles

primary

#003060 provides a strong, deep blue foundation for main content areas or brand identity.

secondary

#104E8B offers a slightly brighter, yet still deep blue for supporting sections or interactive elements.

accent

#007BA7 delivers a vibrant, clear blue, ideal for calls-to-action, highlights, or key information.

background

#002040 creates the deepest, most immersive background, allowing other blues to emerge.

text

Use white or a very light gray (e.g., #F0F0F0) for all text on these deep blue backgrounds to ensure readability.

Accessibility notes

  • Strictly use white or very light text (e.g., #EEEEEE) on all colors in this palette for optimal contrast and readability.
  • Avoid using any of the darker blues for text against each other, as contrast will be insufficient for most users.
  • Ensure interactive elements have clear visual cues (e.g., underlines, icons) in addition to color.
  • For data visualization, use clear labeling and patterns alongside color to convey information.

Recommended combinations

Deep Sea

Ideal for hero sections or dramatic visual displays, creating depth with a vibrant highlight.

#002040 · #003060 · #007BA7

Ocean Layers

Excellent for layered UI elements, showcasing a smooth transition between deep blue shades.

#003060 · #104E8B · #005B9A

Twilight Abyss

Creates a sophisticated and mysterious aesthetic, suitable for intros or atmospheric backgrounds.

#002040 · #005B9A · #007BA7

CSS variables

:root {
  --celestial-ocean-depth-3-1: #003060;
  --celestial-ocean-depth-3-2: #005B9A;
  --celestial-ocean-depth-3-3: #007BA7;
  --celestial-ocean-depth-3-4: #002040;
  --celestial-ocean-depth-3-5: #104E8B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "celestial-ocean-depth-3": {
        1: "#003060",
        2: "#005B9A",
        3: "#007BA7",
        4: "#002040",
        5: "#104E8B",
      }
    }
  }
}

Related searches

deep blue color paletteoceanic dark themeprofessional blue UImystery water colorscorporate navy scheme

Palette colors

Hex values

Color 1#003060
·
Color 2#005B9A
·
Color 3#007BA7
·
Color 4#002040
·
Color 5#104E8B
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
2.8:1Fail
1.2:1Fail
1.6:1Fail
2
1.9:1Fail
1.5:1Fail
2.3:1Fail
1.2:1Fail
3
2.8:1Fail
1.5:1Fail
3.4:1AA18
1.8:1Fail
4
1.2:1Fail
2.3:1Fail
3.4:1AA18
1.9:1Fail
5
1.6:1Fail
1.2:1Fail
1.8:1Fail
1.9:1Fail

Similar palettes

More like Celestial Ocean Depth

View all Dark
Deep Sea Lumen
Midnight Ocean Depths
Abyssal Light Organism
Ancient Bronze Ritual
Arid Dusk Hues
Deep Ocean Abyss