Palette

Deep Sea Cavern

Reflects the mysterious darkness and shimmering light found in a hidden underwater cavern.

darkdark5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Deep Sea Cavern 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 Sea Cavern.

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

Data visualization

#1A1B29#2E3B5B#455E8D#6C93C7#A4CCE9

Palette guide

How to use Deep Sea Cavern

Overview

The Deep Sea Cavern palette reflects the mysterious darkness and shimmering light found in a hidden underwater cavern. Starting with the profound #1A1B29, it gradually lightens through a spectrum of cool blues: #2E3B5B, #455E8D, and #6C93C7. The brightest tone, #A4CCE9, evokes the ethereal glow of light filtering through water, or perhaps bioluminescent formations. This gradient-rich collection is incredibly versatile, allowing designers to craft interfaces that feel both deep and airy. It’s perfect for establishing a serene, contemplative mood while maintaining excellent readability through its thoughtful progression of blues.

Best used for

Luxury spa websites
Educational marine biology content
Serene meditation apps
Atmospheric video game environments
Corporate branding (trust, stability)
Interior design inspiration (calm spaces)

Suggested color roles

primary

#1A1B29 (The deepest, almost black-blue, ideal for foundational backgrounds and creating a sense of depth.)

secondary

#2E3B5B (A rich, deep blue for secondary content areas, panels, or large sections of text.)

accent

#A4CCE9 (The lightest, ethereal blue, perfect for highlights, active states, or subtle calls to action.)

background

#1A1B29 (Establishes a dark, mysterious base, allowing lighter blues to shine and create contrast.)

text

#A4CCE9 (Excellent for primary text on dark backgrounds, providing clear readability and a soft glow.)

Accessibility notes

#A4CCE9 provides good contrast against #1A1B29 and #2E3B5B, making it suitable for body text.
Ensure #6C93C7 offers sufficient contrast when used on #1A1B29 or #2E3B5B for larger text or headings.
Avoid using #1A1B29 or #2E3B5B for text on each other, as contrast may be insufficient.
This palette has a natural light-to-dark progression, which generally aids in creating accessible visual hierarchies.

Recommended combinations

Cavern Depths

Deep, layered blues for backgrounds and structural elements.

#1A1B29 · #2E3B5B · #455E8D

Shimmering Light

Gradient effect for headers, cards, or interactive components, mimicking light.

#455E8D · #6C93C7 · #A4CCE9

Contrast & Clarity

Strong contrast for clear readability and highlighting key information.

#1A1B29 · #A4CCE9 · #6C93C7

CSS variables

:root {
  --deep-sea-cavern-2-1: #1A1B29;
  --deep-sea-cavern-2-2: #2E3B5B;
  --deep-sea-cavern-2-3: #455E8D;
  --deep-sea-cavern-2-4: #6C93C7;
  --deep-sea-cavern-2-5: #A4CCE9;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-sea-cavern-2": {
        1: "#1A1B29",
        2: "#2E3B5B",
        3: "#455E8D",
        4: "#6C93C7",
        5: "#A4CCE9",
      }
    }
  }
}

Hex values

Color 1#1A1B29

Color 2#2E3B5B

Color 3#455E8D

Color 4#6C93C7

Color 5#A4CCE9

Accessibility

Contrast checker

1.5:1Fail

2.6:1Fail

5.4:1AA

10.1:1AAA

1.5:1Fail

1.7:1Fail

3.5:1AA18

6.5:1AA

2.6:1Fail

1.7:1Fail

2:1Fail

3.8:1AA18

5.4:1AA

3.5:1AA18

2:1Fail

1.9:1Fail

10.1:1AAA

6.5:1AA

3.8:1AA18

1.9:1Fail

Similar palettes

More like Deep Sea Cavern

View all dark

Abyssal Trench Mystery

Abyssal Midnight Reef