Back to palettes

Palette

Deep Sea Hydrothermal

Explores the dark, pressure-laden environment of deep-sea hydrothermal vents with muted blues and greys.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0B0E0F#1C2B35#3A4C5F#6E849B#9CABC0

Palette guide

How to use Deep Sea Hydrothermal

Overview

The Deep Sea Hydrothermal palette explores the dark, pressure-laden environment of deep-sea vents with muted blues and greys. This sophisticated collection, ranging from the near-black #0B0E0F to the soft #9CABC0, provides a calm yet intriguing aesthetic. The intermediate shades, including #1C2B35, #3A4C5F, and #6E849B, allow designers to create layered compositions with subtle depth and clarity. This palette is particularly effective for projects requiring a serious, professional, or understatedly elegant feel, offering a stable and modern foundation. It's excellent for conveying a sense of advanced technology, scientific exploration, or quiet luxury.

Best used for

  • Marine research institution websites
  • High-tech product design interfaces
  • Documentary film graphics and branding
  • Professional services company branding
  • Minimalist UI/UX designs
  • Photography portfolios (especially nature/science)

Suggested color roles

primary

Utilize #0B0E0F as the foundational background or primary brand color to establish a deep, authoritative, and stable presence.

secondary

Apply #1C2B35 for major content sections, navigation, or as a slightly lighter dark tone to add subtle structure.

accent

Highlight interactive elements, calls to action, or key information with #9CABC0, providing a gentle, sophisticated contrast.

background

The profound #0B0E0F offers an excellent, unobtrusive canvas, ensuring content stands out with optimal readability for light text.

text

For maximum readability, use crisp white or a very pale, cool gray (e.g., #F5F5F5) for primary text. #6E849B can be used for secondary text.

Accessibility notes

  • Ensure sufficient contrast when using #6E849B or #9CABC0 for text on darker backgrounds; larger text is generally safer.
  • The subtle differences between the darker shades might not provide enough contrast for functional elements; use them primarily for aesthetic depth.
  • Always check text and background color combinations against WCAG guidelines for readability, especially for small font sizes.
  • Consider using a slightly brighter white for text to enhance visibility against the darkest greys like #0B0E0F.

Recommended combinations

Deep Core

Creates a strong, dark base with a soft, elegant highlight for headings or important UI elements.

#0B0E0F · #1C2B35 · #9CABC0

Muted Layers

Ideal for seamless background transitions, subtle hover effects, or progressive disclosure in user interfaces.

#1C2B35 · #3A4C5F · #6E849B

Abyssal Focus

Perfect for a dark background, a mid-tone for secondary content, and a lighter shade for key information or outlines.

#0B0E0F · #6E849B · #3A4C5F

CSS variables

:root {
  --deep-sea-hydrothermal-1: #0B0E0F;
  --deep-sea-hydrothermal-2: #1C2B35;
  --deep-sea-hydrothermal-3: #3A4C5F;
  --deep-sea-hydrothermal-4: #6E849B;
  --deep-sea-hydrothermal-5: #9CABC0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-sea-hydrothermal": {
        1: "#0B0E0F",
        2: "#1C2B35",
        3: "#3A4C5F",
        4: "#6E849B",
        5: "#9CABC0",
      }
    }
  }
}

Related searches

muted blue grey palettedeep sea mysterious colorshydrothermal vent color schemeprofessional dark cool tonesabyssal ocean UI design

Palette colors

Hex values

Color 1#0B0E0F
·
Color 2#1C2B35
·
Color 3#3A4C5F
·
Color 4#6E849B
·
Color 5#9CABC0
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
2.2:1Fail
5:1AA
8.3:1AAA
2
1.3:1Fail
1.6:1Fail
3.8:1AA18
6.2:1AA
3
2.2:1Fail
1.6:1Fail
2.3:1Fail
3.8:1AA18
4
5:1AA
3.8:1AA18
2.3:1Fail
1.7:1Fail
5
8.3:1AAA
6.2:1AA
3.8:1AA18
1.7:1Fail

Similar palettes

More like Deep Sea Hydrothermal

View all dark