Back to palettes

Palette

Deep Abyss Current

Captures the cold, profound tranquility and hidden wonders of the ocean's darkest trenches.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0A0A2A#1E2B45#0F3A4B#3C6A87#2D506C

Palette guide

How to use Deep Abyss Current

Overview

The Deep Abyss Current palette captures the cold, profound tranquility and hidden wonders of the ocean's darkest trenches. This collection features a range of deep, muted blues and teal-grays, from the almost black #0A0A2A to the subtly vibrant #3C6A87. Designers and developers can utilize these captivating hues, including the sophisticated #1E2B45, the intriguing #0F3A4B, and the balanced #2D506C, to create immersive digital experiences, serious brand identities, or atmospheric visual projects. Its cohesive, cool-toned blend evokes a sense of mystery, depth, and understated power, perfect for designs that require a serious, elegant, and technologically advanced aesthetic.

Best used for

  • Marine conservation websites
  • Data analytics dashboards
  • High-tech corporate branding
  • Documentary film titles
  • Cybersecurity interfaces
  • Abstract or minimalist art projects

Suggested color roles

primary

#1E2B45 - A deep, sophisticated navy blue that serves as a strong primary color, ideal for backgrounds, main sections, or brand elements, conveying trust and depth.

secondary

#2D506C - A balanced, muted blue-gray, excellent for secondary navigation, subheadings, or as a complementary background section, adding subtle variation.

accent

#3C6A87 - This slightly brighter blue provides a gentle yet effective accent, perfect for interactive elements, data visualization, or to highlight key information without being overly bold.

background

#0A0A2A - A very deep, almost black-blue, ideal for creating immersive and profound backgrounds that make lighter elements stand out and convey a sense of vastness.

text

#0F3A4B - A deep teal-blue, suitable for subtle decorative text on very light backgrounds. For primary text on #0A0A2A or #1E2B45, white or a very light gray is essential for readability.

Accessibility notes

  • White or very light gray text on #0A0A2A, #1E2B45, and #0F3A4B will provide excellent contrast and readability.
  • Avoid using #0F3A4B or #2D506C for text on #3C6A87 as contrast may be insufficient.
  • The lighter blues like #3C6A87 offer moderate contrast with dark text (e.g., #0A0A2A) when used as backgrounds for smaller, distinct elements.
  • Ensure sufficient contrast for interactive elements and their states, especially against similar dark backgrounds.

Recommended combinations

Trench Depths

#0A0A2A as a profound background, #3C6A87 for subtle highlights, and #1E2B45 for main content.

#0A0A2A · #3C6A87 · #1E2B45

Submarine Hues

Ideal for creating a layered, deep-sea effect in backgrounds or complex data visualizations.

#1E2B45 · #2D506C · #0F3A4B

Calm Contrast

#0A0A2A for grounding, #2D506C for supporting elements, and #3C6A87 for gentle interactive accents.

#0A0A2A · #2D506C · #3C6A87

CSS variables

:root {
  --deep-abyss-current-1: #0A0A2A;
  --deep-abyss-current-2: #1E2B45;
  --deep-abyss-current-3: #0F3A4B;
  --deep-abyss-current-4: #3C6A87;
  --deep-abyss-current-5: #2D506C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-abyss-current": {
        1: "#0A0A2A",
        2: "#1E2B45",
        3: "#0F3A4B",
        4: "#3C6A87",
        5: "#2D506C",
      }
    }
  }
}

Related searches

deep sea color palettedark blue gray schememysterious water colorsprofound design huescool tech palette

Palette colors

Hex values

Color 1#0A0A2A
·
Color 2#1E2B45
·
Color 3#0F3A4B
·
Color 4#3C6A87
·
Color 5#2D506C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
1.6:1Fail
3.3:1AA18
2.3:1Fail
2
1.4:1Fail
1.2:1Fail
2.4:1Fail
1.7:1Fail
3
1.6:1Fail
1.2:1Fail
2.1:1Fail
1.4:1Fail
4
3.3:1AA18
2.4:1Fail
2.1:1Fail
1.5:1Fail
5
2.3:1Fail
1.7:1Fail
1.4:1Fail
1.5:1Fail

Similar palettes

More like Deep Abyss Current

View all dark
Abyssal Midnight Reef
Deep Cobalt Plunge
Deep Ocean Abyss
Deep Ocean Trench
Deep Ocean Twilight
Deep Ocean Voyage