Back to palettes

Palette

Oceanic Dark Lumina

The deep, enigmatic luminescence of the ocean's darkest, most unreachable depths.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Oceanic Dark Lumina 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 Oceanic Dark Lumina.

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

Data visualization

#000033#001A4C#003366#004D99#0066CC

Palette guide

How to use Oceanic Dark Lumina

Overview

The Oceanic Dark Lumina palette evokes the mysterious glow of the deep sea, offering a sophisticated gradient of dark blues. Starting from the near-black #000033, it transitions through rich tones like #001A4C and #003366, culminating in the more luminous #004D99 and #0066CC. This collection is ideal for designers and developers aiming to create sleek, professional, and immersive digital experiences. Its depth and subtle vibrance make it perfect for conveying trustworthiness and innovation. The palette's cohesive nature allows for harmonious designs, ensuring a refined aesthetic across various applications, from corporate websites to elegant mobile interfaces, reflecting the enigmatic beauty of the ocean's depths.

Best used for

  • Luxury brand websites
  • Financial tech applications
  • Deep space themed games
  • Professional corporate branding
  • High-end product showcases
  • Data visualization dashboards

Suggested color roles

primary

Use #001A4C for foundational elements, providing a deep, stable base for your design.

secondary

Apply #003366 to complement the primary, adding subtle variation and depth in sections or secondary navigation.

accent

Highlight interactive elements or key information with #0066CC, offering a luminous contrast that draws the eye.

background

Employ #000033 as a dark, immersive background, creating a sense of depth and allowing lighter elements to shine.

text

For optimal readability, use white or a near-white color like #E0E0E0 for text across all shades in this dark palette.

Accessibility notes

  • Ensure all text has sufficient contrast against the dark backgrounds, primarily using white or very light text.
  • Avoid using two dark blues for text and background unless the text is very large and bold.
  • Test interactive elements for visual cues beyond color, as some blue shades can be hard to differentiate for certain users.
  • The lighter #0066CC should be used carefully for text on #004D99 to maintain contrast.

Recommended combinations

Abyssal Depth

Perfect for creating a profound, layered background or sophisticated header sections.

#000033 · #001A4C · #003366

Lumina Highlight

Ideal for showcasing key features or navigation elements with a subtle glow.

#004D99 · #0066CC · #001A4C

Deep Gradient

Excellent for gradients in hero sections or visual transitions, offering smooth depth.

#000033 · #003366 · #0066CC

CSS variables

:root {
  --oceanic-dark-lumina-1: #000033;
  --oceanic-dark-lumina-2: #001A4C;
  --oceanic-dark-lumina-3: #003366;
  --oceanic-dark-lumina-4: #004D99;
  --oceanic-dark-lumina-5: #0066CC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "oceanic-dark-lumina": {
        1: "#000033",
        2: "#001A4C",
        3: "#003366",
        4: "#004D99",
        5: "#0066CC",
      }
    }
  }
}

Related searches

dark blue color schemedeep ocean palettemysterious blue huesluminescent dark colorscorporate blue branding

Palette colors

Hex values

Color 1#000033
·
Color 2#001A4C
·
Color 3#003366
·
Color 4#004D99
·
Color 5#0066CC
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.6:1Fail
2.4:1Fail
3.6:1AA18
2
1.2:1Fail
1.3:1Fail
2:1Fail
3:1AA18
3
1.6:1Fail
1.3:1Fail
1.5:1Fail
2.3:1Fail
4
2.4:1Fail
2:1Fail
1.5:1Fail
1.5:1Fail
5
3.6:1AA18
3:1AA18
2.3:1Fail
1.5:1Fail

Similar palettes

More like Oceanic Dark Lumina

View all dark
Abyss Gaze
Abyssal Bioluminescence
Abyssal Bioluminescent Glow
Abyssal Coral Glow
Abyssal Depths
Abyssal Midnight Reef