Back to palettes

Palette

Deep Sea Hydrothermal

Inspired by the eerie beauty of hydrothermal vents in the deepest ocean trenches, conveying profound depths and mystery.

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

#0F1F2F#2F3F4F#4F5F6F#6F7F8F#8F9FAF

Palette guide

How to use Deep Sea Hydrothermal

Overview

The Deep Sea Hydrothermal palette is inspired by the eerie beauty of hydrothermal vents in the deepest ocean trenches, conveying profound depths and mystery. This gradient of cool, muted blues and greys, from the intense #0F1F2F to the lighter #8F9FAF, offers a sophisticated and understated aesthetic. It's ideal for designs that require a sense of tranquility, seriousness, or advanced technology. The subtle progression of shades—including #2F3F4F, #4F5F6F, and #6F7F8F—allows for seamless layering and depth creation without overwhelming the viewer. This palette is a robust choice for conveying stability and a modern, clean look.

Best used for

  • Tech company branding and websites
  • Scientific data visualization platforms
  • Minimalist app interfaces
  • Luxury automotive or aerospace design concepts
  • Documentary film graphics
  • Professional portfolios and presentations

Suggested color roles

primary

Use #0F1F2F as the dominant background or brand color to establish a deep, stable, and professional foundation.

secondary

Apply #2F3F4F for secondary content areas, navigation, or as a slightly lighter dark tone for visual separation.

accent

Highlight subtle interactive elements or key data points with #8F9FAF, offering a soft, cool contrast.

background

The profound #0F1F2F creates an excellent, unobtrusive backdrop, ensuring focus on content and providing high contrast for light text.

text

For optimal readability, use white or a very light cool gray (e.g., #F8F8F8) for primary text. #6F7F8F can be used for subtle secondary text.

Accessibility notes

  • Ensure sufficient contrast when using #6F7F8F or #8F9FAF for text on darker backgrounds; larger text is often safer.
  • The subtle variations between adjacent 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 shades like #0F1F2F.

Recommended combinations

Deep Gradient

Ideal for smooth background transitions, layered UI elements, or subtle depth effects in a dark theme.

#0F1F2F · #2F3F4F · #4F5F6F

Mystic Highlight

Creates a strong dark base with a soft, cool highlight for headings or important information, supported by a mid-tone.

#0F1F2F · #8F9FAF · #6F7F8F

Oceanic Layers

Perfect for complex dashboards or data visualizations, providing clear visual separation with harmonious cool tones.

#2F3F4F · #4F5F6F · #8F9FAF

CSS variables

:root {
  --deep-sea-hydrothermal-5-1: #0F1F2F;
  --deep-sea-hydrothermal-5-2: #2F3F4F;
  --deep-sea-hydrothermal-5-3: #4F5F6F;
  --deep-sea-hydrothermal-5-4: #6F7F8F;
  --deep-sea-hydrothermal-5-5: #8F9FAF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-sea-hydrothermal-5": {
        1: "#0F1F2F",
        2: "#2F3F4F",
        3: "#4F5F6F",
        4: "#6F7F8F",
        5: "#8F9FAF",
      }
    }
  }
}

Related searches

dark deep ocean colorshydrothermal vent inspired palettecool grey blue color schememinimalist dark UI colorsmysterious submerged palette

Palette colors

Hex values

Color 1#0F1F2F
·
Color 2#2F3F4F
·
Color 3#4F5F6F
·
Color 4#6F7F8F
·
Color 5#8F9FAF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.5:1Fail
4.1:1AA18
6.2:1AA
2
1.5:1Fail
1.6:1Fail
2.6:1Fail
4:1AA18
3
2.5:1Fail
1.6:1Fail
1.6:1Fail
2.4:1Fail
4
4.1:1AA18
2.6:1Fail
1.6:1Fail
1.5:1Fail
5
6.2:1AA
4:1AA18
2.4:1Fail
1.5:1Fail

Similar palettes

More like Deep Sea Hydrothermal

View all dark
Abyssal Trench Mystery
Bioluminescent Deep Trench
Dark Sea Onyx
Deep Ocean Abyssal
Deep Ocean Caverns
Deep Sea Explorer