Back to palettes

Palette

Deep Trench Lumina

Plunges into the mysterious, dark depths of the ocean abyss, where light is a rare visitor.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Deep Trench 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 Deep Trench Lumina.

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

Data visualization

#001F3F#003366#004C99#0066CC#B0E0E6

Palette guide

How to use Deep Trench Lumina

Overview

The Deep Trench Lumina palette, with its profound blues like #001F3F and #003366, evokes the enigmatic allure of the ocean's abyssal depths. This dark, mysterious collection is balanced by brighter, yet still deep, blues such as #004C99 and #0066CC, culminating in the serene, almost ethereal #B0E0E6. Designers can leverage this palette for projects requiring a sense of depth, tranquility, and understated elegance. Developers will find these blues versatile for creating immersive UI experiences, dark mode themes, or brand identities that convey sophistication and mystery, offering a rich visual journey from the deepest trench to a distant glimmer.

Best used for

  • Luxury brand websites or packaging
  • Marine-themed apps or educational content
  • Dark mode UI designs
  • Abstract art or digital illustrations
  • Interior design for serene, contemplative spaces
  • Science fiction game environments

Suggested color roles

primary

#001F3F - Ideal for large background areas or dominant brand elements, establishing a deep, mysterious foundation.

secondary

#004C99 - Excellent for navigation, headings, or significant graphic elements, providing a vibrant contrast to the deepest blue.

accent

#B0E0E6 - Perfect for interactive elements, highlights, or small decorative details, offering a luminous focal point.

background

#003366 - A slightly lighter, yet still deep, blue suitable for content sections or secondary backgrounds, maintaining the dark theme.

text

#B0E0E6 - Highly recommended for primary text against dark backgrounds like #001F3F or #003366 to ensure excellent readability.

Accessibility notes

  • Ensure sufficient contrast when using #B0E0E6 for text against the darker blues like #001F3F (WCAG AA pass).
  • Avoid using #001F3F and #003366 for adjacent text and background elements without careful contrast checking.
  • Consider a very light grey or white for small text elements against #0066CC if #B0E0E6 feels too strong.
  • For critical information, aim for WCAG AAA contrast, especially with smaller font sizes on backgrounds like #004C99.

Recommended combinations

Deep Ocean Gradient

For creating smooth, immersive background gradients or layered UI elements that convey depth.

#001F3F · #003366 · #004C99

Luminous Accent

To highlight key information or interactive components, with #B0E0E6 acting as a clear call to action against darker blues.

#003366 · #B0E0E6 · #0066CC

Subtle Depth

Effective for branding or sophisticated data visualization, using the progression for hierarchy or distinction.

#001F3F · #004C99 · #0066CC

CSS variables

:root {
  --deep-trench-lumina-1: #001F3F;
  --deep-trench-lumina-2: #003366;
  --deep-trench-lumina-3: #004C99;
  --deep-trench-lumina-4: #0066CC;
  --deep-trench-lumina-5: #B0E0E6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-trench-lumina": {
        1: "#001F3F",
        2: "#003366",
        3: "#004C99",
        4: "#0066CC",
        5: "#B0E0E6",
      }
    }
  }
}

Related searches

deep blue color schemeocean abyss palettemysterious blue brandingdark blue UI colorsluminous deep sea palette

Palette colors

Hex values

Color 1#001F3F
·
Color 2#003366
·
Color 3#004C99
·
Color 4#0066CC
·
Color 5#B0E0E6
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
2:1Fail
3:1Fail
11.6:1AAA
2
1.3:1Fail
1.5:1Fail
2.3:1Fail
8.8:1AAA
3
2:1Fail
1.5:1Fail
1.5:1Fail
5.9:1AA
4
3:1Fail
2.3:1Fail
1.5:1Fail
3.9:1AA18
5
11.6:1AAA
8.8:1AAA
5.9:1AA
3.9:1AA18

Similar palettes

More like Deep Trench Lumina

View all dark
Abyss Gaze
Abyssal Bioluminescent Glow
Abyssal Coral Glow
Abyssal Depths
Abyssal Rift Shimmer
Abyssal Trench Dive