Back to palettes

Palette

Cosmic Ocean Depths

Inky blues and profound teals reflect the vast, dark mysteries of an unknown ocean in space.

cooldark5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cosmic Ocean Depths 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 Cosmic Ocean Depths.

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

Data visualization

#0A1128#031E40#03396C#00509D#6A8EAE

Palette guide

How to use Cosmic Ocean Depths

Overview

The Cosmic Ocean Depths palette features inky blues and profound teals, reflecting the vast, dark mysteries of an unknown ocean in space. It anchors with the ultra-deep #0A1128 (midnight blue) and the rich #031E40 (deep navy), transitioning beautifully through the intense #03396C (dark cerulean) and the vibrant #00509D (royal blue). The palette culminates in the serene #6A8EAE (muted blue-grey), offering a delicate, misty contrast. This cool and dark collection is perfect for designers and developers crafting mysterious, sophisticated, or trustworthy digital experiences. It excels in creating atmospheric backgrounds, authoritative branding, and UI elements that convey depth, intrigue, and a sense of endless discovery.

Best used for

  • Professional corporate websites and app interfaces
  • Oceanographic or space exploration branding
  • Mysterious digital art and abstract illustrations
  • Educational content about science and nature
  • Luxury product packaging and marketing
  • Calm environmental graphics and presentations

Suggested color roles

primary

Utilize #0A1128 as a deep, anchoring background color, establishing a calm, professional canvas for content to unfold.

secondary

Employ #031E40 or #03396C for significant content areas, subheadings, or distinct sections, offering rich, supporting blue hues.

accent

Apply #00509D for subtle highlights, interactive states, or as a secondary text color on dark backgrounds, adding a touch of sophisticated blue.

background

The darker blues like #0A1128 and #031E40 are ideal for expansive, tranquil backdrops, while #6A8EAE can be used for subtle, glowing elements or light mode accents.

text

For optimal readability on dark backgrounds like #0A1128 or #031E40, use #6A8EAE or a crisp white. A deep charcoal or black provides excellent contrast on #6A8EAE.

Accessibility notes

  • Ensure sufficient contrast between #6A8EAE and the darker background colors, especially for body text.
  • White text on #0A1128, #031E40, #03396C, and #00509D generally provides good readability.
  • Avoid using #00509D as a text color on #03396C due to potential low contrast; reserve it for larger UI elements.
  • Test color combinations for legibility across various screen types and lighting conditions to maintain the desired mood.

Recommended combinations

Abyssal Core

Creates a deep, harmonious blue gradient, perfect for professional backgrounds or subtly layered UI designs.

#0A1128 · #031E40 · #03396C

Deep Blue Shimmer

Ideal for subtle gradients, ethereal overlays, or conveying a soft, luminous glow in illustrations and decorative elements.

#03396C · #00509D · #6A8EAE

Cosmic Depths Contrast

Excellent for establishing clear hierarchy, with a light highlight against a dark canvas, enhanced by a serene blue accent.

#0A1128 · #6A8EAE · #00509D

CSS variables

:root {
  --cosmic-ocean-depths-1: #0A1128;
  --cosmic-ocean-depths-2: #031E40;
  --cosmic-ocean-depths-3: #03396C;
  --cosmic-ocean-depths-4: #00509D;
  --cosmic-ocean-depths-5: #6A8EAE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cosmic-ocean-depths": {
        1: "#0A1128",
        2: "#031E40",
        3: "#03396C",
        4: "#00509D",
        5: "#6A8EAE",
      }
    }
  }
}

Related searches

inky blue space palettedeep ocean cosmic colorsmystery blue themeprofessional dark blue uicalm deep ocean gradient

Palette colors

Hex values

Color 1#0A1128
·
Color 2#031E40
·
Color 3#03396C
·
Color 4#00509D
·
Color 5#6A8EAE
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.6:1Fail
2.3:1Fail
5.4:1AA
2
1.1:1Fail
1.4:1Fail
2.1:1Fail
4.8:1AA
3
1.6:1Fail
1.4:1Fail
1.5:1Fail
3.4:1AA18
4
2.3:1Fail
2.1:1Fail
1.5:1Fail
2.3:1Fail
5
5.4:1AA
4.8:1AA
3.4:1AA18
2.3:1Fail

Similar palettes

More like Cosmic Ocean Depths

View all cool
Deep Ocean Trench
Oceanic Depths Mystery
Abyssal Bioluminescence
Abyssal Current Glide
Arctic Ocean Depths
Bioluminescent Abyss