Back to palettes

Palette

Deep Sea Abyss

Intense, inky blues plunging into the unfathomable depths of the ocean abyss.

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

#000033#000055#0A0A88#1A1AB0#2F2FCF

Palette guide

How to use Deep Sea Abyss

Overview

The Deep Sea Abyss palette (version 2) plunges into the unfathomable depths of the ocean, featuring intense, inky blues. From the profound #000033 to the vivid #2F2FCF, this palette is ideal for designs that demand mystery, technological sophistication, and a sense of dark wonder. Designers can craft immersive digital experiences, captivating branding, and impactful UI themes. Developers will find these hex codes perfect for projects related to high-tech, science fiction, or any application that benefits from a dark, dynamic, and visually striking aesthetic. The progression from #000055 to #1A1AB0 allows for excellent depth and vivid highlights.

Best used for

  • High-tech software interfaces
  • Science fiction game environments
  • Luxury watch or jewelry brands (dark theme)
  • Cybersecurity platform UI
  • Abstract art digital showcases
  • Dark mode web applications

Suggested color roles

primary

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

secondary

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

accent

Introduce #2F2FCF as a powerful, luminous accent for calls-to-action, key features, or interactive elements, ensuring maximum impact.

background

The deepest hue, #000033, 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. #2F2FCF can be used for larger headings or highlights on the darkest backgrounds.

Accessibility notes

  • Ensure very high contrast for text on #000033, #000055, and #0A0A88 by using light text (e.g., pure white or #2F2FCF).
  • The lightest color, #2F2FCF, provides excellent contrast for primary text against all darker blues in the palette.
  • Avoid using adjacent dark blues 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, deep background or card system, conveying profound depth and mystery.

#000033 · #000055 · #0A0A88

Deep Glow

Use #000055 as a base, with #1A1AB0 for secondary elements and #2F2FCF for vibrant, electric highlights or interactive states.

#000055 · #1A1AB0 · #2F2FCF

Electric Abyss

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

#000033 · #2F2FCF · #1A1AB0

CSS variables

:root {
  --deep-sea-abyss-2-1: #000033;
  --deep-sea-abyss-2-2: #000055;
  --deep-sea-abyss-2-3: #0A0A88;
  --deep-sea-abyss-2-4: #1A1AB0;
  --deep-sea-abyss-2-5: #2F2FCF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-sea-abyss-2": {
        1: "#000033",
        2: "#000055",
        3: "#0A0A88",
        4: "#1A1AB0",
        5: "#2F2FCF",
      }
    }
  }
}

Related searches

deep blue abyss palettedark blue tech hex codesmysterious blue UI designelectric navy color schemesci-fi blue branding

Palette colors

Hex values

Color 1#000033
·
Color 2#000055
·
Color 3#0A0A88
·
Color 4#1A1AB0
·
Color 5#2F2FCF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.3:1Fail
1.7:1Fail
2.3:1Fail
2
1.1:1Fail
1.2:1Fail
1.6:1Fail
2.1:1Fail
3
1.3:1Fail
1.2:1Fail
1.3:1Fail
1.7:1Fail
4
1.7:1Fail
1.6:1Fail
1.3:1Fail
1.3:1Fail
5
2.3:1Fail
2.1:1Fail
1.7:1Fail
1.3:1Fail

Similar palettes

More like Deep Sea Abyss

View all dark
Abyss Gaze
Abyssal Bioluminescent Glow
Abyssal Coral Glow
Abyssal Depths
Abyssal Rift Shimmer
Abyssal Trench Dive