Back to palettes

Palette

Deep Sea Abyss

Explores the profound and enigmatic depths of the ocean's abyssal zones.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0A1C2C#1B3C52#2C5A76#07131F#0E293F

Palette guide

How to use Deep Sea Abyss

Overview

The Deep Sea Abyss palette explores the profound and enigmatic depths of the ocean's abyssal zones, featuring a range of dark, sophisticated blues. From the deepest #07131F to the slightly lighter #2C5A76, this palette is ideal for designs that demand mystery, professionalism, and a sense of calm power. Designers can craft immersive digital experiences, captivating branding, and impactful UI themes. Developers will find these hex codes perfect for projects related to marine science, high-tech, or any application that benefits from a dark, elegant, and visually striking aesthetic. The subtle progression from #0A1C2C to #1B3C52 allows for excellent depth and visual hierarchy.

Best used for

  • Marine research institution websites
  • Luxury travel agencies (deep sea expeditions)
  • High-end tech company branding
  • Documentaries about ocean exploration
  • Dark mode UI for professional applications
  • Environmental conservation initiatives

Suggested color roles

primary

Utilize #0A1C2C as the main background or primary content color, providing a deep, sophisticated, and stable foundation.

secondary

Apply #1B3C52 for secondary content areas, panels, or navigation, offering a rich visual distinction and layered effect.

accent

Introduce #2C5A76 as a soft, yet noticeable accent for interactive elements, key features, or important data points, ensuring gentle visibility.

background

The deepest hue, #07131F, is excellent for expansive backgrounds or header sections, establishing an immediate tone of profound abyss.

text

For optimal readability, use a crisp white or very light gray. #2C5A76 can be used for larger headings or highlights on the darkest backgrounds.

Accessibility notes

  • Ensure high contrast for text on #07131F, #0A1C2C, and #1B3C52 by using light text (e.g., white or #2C5A76).
  • The lightest color, #2C5A76, provides good contrast for primary text against the darker blues in the palette.
  • Avoid using #07131F and #0A1C2C for small text or critical UI elements in close proximity without careful contrast checks.
  • Always test color combinations with accessibility tools to ensure WCAG compliance for readability.

Recommended combinations

Abyssal Layers

Ideal for creating a layered, dark background or card system, conveying profound depth and mystery.

#07131F · #0A1C2C · #0E293F

Deep Sea Flow

Use #0A1C2C as a base, with #1B3C52 for secondary elements and #2C5A76 for subtle highlights or interactive states.

#0A1C2C · #1B3C52 · #2C5A76

Profound Contrast

Excellent for a dark, profound background with a clear, soft accent and a strong mid-tone for supporting details.

#07131F · #2C5A76 · #0E293F

CSS variables

:root {
  --deep-sea-abyss-1: #0A1C2C;
  --deep-sea-abyss-2: #1B3C52;
  --deep-sea-abyss-3: #2C5A76;
  --deep-sea-abyss-4: #07131F;
  --deep-sea-abyss-5: #0E293F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-sea-abyss": {
        1: "#0A1C2C",
        2: "#1B3C52",
        3: "#2C5A76",
        4: "#07131F",
        5: "#0E293F",
      }
    }
  }
}

Related searches

deep navy blue paletteoceanic abyss hex codesmysterious dark blue UIprofessional deep sea colorswater dark theme

Palette colors

Hex values

Color 1#0A1C2C
·
Color 2#1B3C52
·
Color 3#2C5A76
·
Color 4#07131F
·
Color 5#0E293F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.3:1Fail
1.1:1Fail
1.2:1Fail
2
1.5:1Fail
1.6:1Fail
1.6:1Fail
1.3:1Fail
3
2.3:1Fail
1.6:1Fail
2.5:1Fail
2:1Fail
4
1.1:1Fail
1.6:1Fail
2.5:1Fail
1.3:1Fail
5
1.2:1Fail
1.3:1Fail
2:1Fail
1.3:1Fail

Similar palettes

More like Deep Sea Abyss

View all dark
Abyssal Deep Current
Abyssal Midnight Reef
Deep Abyss Current
Deep Cobalt Plunge
Deep Ocean Abyss
Deep Ocean Mariana