Back to palettes

Palette

Abyssal Sea Depths

Profoundly deep blues capturing the crushing darkness and mystery of the abyssal ocean.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Abyssal Sea 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 Abyssal Sea Depths.

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

Data visualization

#000080#000033#00001A#191970#00004D

Palette guide

How to use Abyssal Sea Depths

Overview

The Abyssal Sea Depths palette captures the crushing darkness and profound mystery of the abyssal ocean with intensely deep blues. This dark and enigmatic collection features a powerful array of dark blues, including the prominent #000080 (Navy Blue), the almost black #000033 (Dark Indigo), and the even deeper #00001A (Very Dark Indigo), alongside #191970 (Midnight Blue) and #00004D (Deep Indigo). Designers can leverage this palette to evoke a sense of quiet power, deep contemplation, and sophisticated mystery, perfect for dark mode interfaces, cinematic themes, or high-tech branding. Developers will find these blues excellent for establishing subtle visual hierarchy and creating distinct sections, ensuring an elegant and authoritative aesthetic that speaks to hidden depths.

Best used for

  • Dark mode UI/UX design
  • Documentary film branding
  • Luxury tech brand identity
  • Scientific research platforms
  • Mysterious digital art creations
  • Deep ocean themed websites

Suggested color roles

primary

#00001A (Very Dark Indigo) - The darkest shade, ideal for main backgrounds, navigation bars, and primary content containers, providing profound depth.

secondary

#000033 (Dark Indigo) - A slightly lighter, yet still deep, blue for secondary panels, card backgrounds, or subtle dividing lines.

accent

#000080 (Navy Blue) - Use this slightly brighter, rich blue for interactive elements, hover states, or to highlight key data points with a subtle glow.

background

#00001A (Very Dark Indigo) - Creates an immersive, inky black background, making any lighter elements subtly stand out.

text

White (#FFFFFF) or a very light grey (#F0F0F0) provides optimal contrast for readability against all dark blues in this palette.

Accessibility notes

  • Ensure all text, especially on the darkest backgrounds, uses white or very light grey for high contrast and readability.
  • The palette is predominantly dark; avoid using any of the darker blues for text on similar dark backgrounds.
  • When using #000080 as an accent, ensure it has sufficient contrast against the surrounding darker blues.
  • Consider using a slightly brighter white for critical calls-to-action to ensure they are easily discoverable.

Recommended combinations

Profound Depths

Excellent for creating layered dark backgrounds, deep content containers, or subtle depth effects in UI design.

#00001A · #000033 · #00004D

Subtle Glimmer

Ideal for highlighting active states, subtle calls-to-action, or creating a mysterious glow against profound darks.

#000033 · #191970 · #000080

Abyssal Contrast

Perfect for establishing clear visual hierarchy between deep background and important foreground elements.

#00001A · #00004D · #000080

CSS variables

:root {
  --abyssal-sea-depths-1: #000080;
  --abyssal-sea-depths-2: #000033;
  --abyssal-sea-depths-3: #00001A;
  --abyssal-sea-depths-4: #191970;
  --abyssal-sea-depths-5: #00004D;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "abyssal-sea-depths": {
        1: "#000080",
        2: "#000033",
        3: "#00001A",
        4: "#191970",
        5: "#00004D",
      }
    }
  }
}

Related searches

deepest blue paletteabyssal dark ocean colorsmidnight blue themeprofound dark UI designmysterious sea depths

Palette colors

Hex values

Color 1#000080
·
Color 2#000033
·
Color 3#00001A
·
Color 4#191970
·
Color 5#00004D
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.3:1Fail
1.1:1Fail
1.2:1Fail
2
1.3:1Fail
1:1Fail
1.3:1Fail
1.1:1Fail
3
1.3:1Fail
1:1Fail
1.4:1Fail
1.1:1Fail
4
1.1:1Fail
1.3:1Fail
1.4:1Fail
1.3:1Fail
5
1.2:1Fail
1.1:1Fail
1.1:1Fail
1.3:1Fail

Similar palettes

More like Abyssal Sea Depths

View all dark
Abyss Gaze
Abyssal Bioluminescent Glow
Abyssal Coral Forms
Abyssal Coral Glow
Abyssal Depths
Abyssal Glow Wonders