Palette

Abyssal Deep Current

Explores the profound and mysterious depths of the ocean's abyssal trenches, dark and ancient.

darkdark5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Abyssal Deep Current 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 Deep Current.

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

Data visualization

#0F0F0F#191970#008080#4682B4#00FF00

Palette guide

How to use Abyssal Deep Current

Overview

The Abyssal Deep Current palette explores the profound and mysterious depths of the ocean's abyssal trenches, dark and ancient. With a near-black #0F0F0F as its foundation and the deep navy #191970 as its primary, it establishes a dramatic and sophisticated mood. The palette is brought to life by the rich teal #008080 and steel blue #4682B4, offering subtle shifts in tone, and is dramatically punctuated by the vibrant #00FF00, mimicking an unexpected bioluminescent burst. Designers can leverage this palette for projects requiring high impact and a sense of wonder, while developers will find the clear contrast between dark backgrounds and vivid accents, like #00FF00, ideal for creating engaging and accessible user interfaces.

Best used for

Sci-fi game UI and environments
Luxury tech product launches
Dark theme web and mobile apps
Music event promotions
Digital art and illustration with glowing effects
Interactive educational content on marine biology

Suggested color roles

primary

Use #191970 for main content areas and structural elements, providing a deep, stable navy presence.

secondary

Apply #008080 for secondary information, subheadings, or background accents, adding a rich, deep teal layer.

accent

Make interactive elements, calls to action, or key data points pop with the vibrant #00FF00, ensuring high visibility.

background

Establish a truly dark and mysterious base with #0F0F0F, allowing other colors to shine with contrast.

text

For softer, supporting text, consider #4682B4. For main body text, a crisp white or very light grey is highly recommended against the dark background.

Accessibility notes

Ensure #00FF00 or white text provides sufficient contrast against #0F0F0F, #191970, and #008080 for readability.
The contrast between #191970 and #008080 can be low for small text; use for larger headings or graphical elements.
Always test text legibility, especially for smaller font sizes, when using #4682B4 on any of the darker blues.
A stark white is often the safest choice for critical text on dark backgrounds to meet accessibility standards.

Recommended combinations

Abyss Burst

Ideal for a dark background with primary content and a vivid, eye-catching bioluminescent accent.

#0F0F0F · #191970 · #00FF00

Deep Sea Layers

Creates a sophisticated blue-teal combination for layered UI elements, data visualization, or subtle highlights.

#191970 · #008080 · #4682B4

Mystic Glow

Excellent for bold hero sections or graphic elements that demand attention with a dark base and two bright, contrasting accents.

#0F0F0F · #4682B4 · #00FF00

CSS variables

:root {
  --abyssal-deep-current-1: #0F0F0F;
  --abyssal-deep-current-2: #191970;
  --abyssal-deep-current-3: #008080;
  --abyssal-deep-current-4: #4682B4;
  --abyssal-deep-current-5: #00FF00;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "abyssal-deep-current": {
        1: "#0F0F0F",
        2: "#191970",
        3: "#008080",
        4: "#4682B4",
        5: "#00FF00",
      }
    }
  }
}

Hex values

Color 1#0F0F0F

Color 2#191970

Color 3#008080

Color 4#4682B4

Color 5#00FF00

Accessibility

Contrast checker

1.3:1Fail

4:1AA18

4.7:1AA

14:1AAA

1.3:1Fail

3.1:1AA18

3.6:1AA18

10.8:1AAA

4:1AA18

3.1:1AA18

1.2:1Fail

3.5:1AA18

4.7:1AA

3.6:1AA18

1.2:1Fail

3:1Fail

14:1AAA

10.8:1AAA

3.5:1AA18

3:1Fail

Similar palettes

More like Abyssal Deep Current

View all dark

Abyss Gaze

Abyssal Bioluminescent Glow

Abyssal Coral Glow

Abyssal Depths

Abyssal Midnight Reef

Abyssal Rift Shimmer