Back to palettes

Palette

Mariana Trench Enigma

Exploring the mysterious and extreme depths of the ocean, where strange lights glow in darkness.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Mariana Trench Enigma 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 Mariana Trench Enigma.

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

Data visualization

#0F1E38#1A2C49#0F4C81#73C6D8#030B1C

Palette guide

How to use Mariana Trench Enigma

Overview

The Mariana Trench Enigma palette delves into the mysterious and extreme depths of the ocean, where strange lights glow in darkness. This collection features ultra-deep navy #030B1C, deep blues #0F1E38 and #1A2C49, a vibrant azure #0F4C81, and a striking bright aqua #73C6D8. It's a powerful palette for designers and developers looking to create immersive, dark-themed experiences with luminous accents. The contrast between the profound darks and the glowing brights evokes a sense of wonder and advanced technology, ideal for sci-fi or luxury digital environments.

Best used for

  • Sci-fi user interfaces and dashboards
  • Gaming UI and atmospheric environments
  • Luxury brand websites and digital experiences
  • Mysterious movie posters and promotional materials
  • Space exploration themes and visualizations
  • Advanced data visualization platforms

Suggested color roles

primary

Utilize #030B1C as the foundational primary color for truly dark backgrounds and core structural elements, establishing enigma.

secondary

Employ #1A2C49 for supporting panels, subtle depth, or background elements, maintaining the dark aesthetic.

accent

Apply #73C6D8 for glowing interactive elements, key highlights, or to represent data points, providing striking contrast.

background

Use #030B1C or #0F1E38 for an immersive, dark-themed background that sets a mysterious and profound tone.

text

For optimal readability on dark backgrounds, use #73C6D8 or white. For text on #73C6D8, use black or a very dark charcoal.

Accessibility notes

  • High contrast is essential: ensure #73C6D8 text on #030B1C or #0F1E38 meets WCAG standards.
  • Avoid using #0F4C81 for small body text on similarly dark backgrounds due to potential readability issues.
  • Ensure sufficient contrast for all text elements, especially when pairing deep blue tones.
  • The bright #73C6D8 should be used judiciously as an accent for best effect and to avoid visual fatigue.

Recommended combinations

Deep Unknown

Perfect for dark mode interfaces, glowing interactive elements, and conveying profound mystery.

#030B1C · #1A2C49 · #73C6D8

Enigmatic Glow

Ideal for highlighting data, interactive states, and creating a sense of subtle, otherworldly illumination.

#0F4C81 · #73C6D8 · #0F1E38

Submerged Depths

Suitable for layered backgrounds, subtle gradients, and adding intricate depth to visual compositions.

#1A2C49 · #0F1E38 · #0F4C81

CSS variables

:root {
  --mariana-trench-enigma-1: #0F1E38;
  --mariana-trench-enigma-2: #1A2C49;
  --mariana-trench-enigma-3: #0F4C81;
  --mariana-trench-enigma-4: #73C6D8;
  --mariana-trench-enigma-5: #030B1C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "mariana-trench-enigma": {
        1: "#0F1E38",
        2: "#1A2C49",
        3: "#0F4C81",
        4: "#73C6D8",
        5: "#030B1C",
      }
    }
  }
}

Related searches

deep sea color palettemysterious dark themeglowing blue accentsci-fi UI colorsabyssal ocean tones

Palette colors

Hex values

Color 1#0F1E38
·
Color 2#1A2C49
·
Color 3#0F4C81
·
Color 4#73C6D8
·
Color 5#030B1C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.9:1Fail
8.5:1AAA
1.2:1Fail
2
1.2:1Fail
1.6:1Fail
7.2:1AAA
1.4:1Fail
3
1.9:1Fail
1.6:1Fail
4.6:1AA
2.2:1Fail
4
8.5:1AAA
7.2:1AAA
4.6:1AA
10.1:1AAA
5
1.2:1Fail
1.4:1Fail
2.2:1Fail
10.1:1AAA

Similar palettes

More like Mariana Trench Enigma

View all dark