Back to palettes

Palette

Deep Sea Geothermal

Dark, enigmatic blues contrasted with vivid, unexpected bursts of color from a deep-sea vent.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0A0A2A#36454F#00CED1#8A2BE2#FF4500

Palette guide

How to use Deep Sea Geothermal

Overview

The Deep Sea Geothermal palette (version 2) features dark, enigmatic blues contrasted with vivid, unexpected bursts of color from a deep-sea vent. Anchored by the profound, near-black #0A0A2A and the deep charcoal #36454F, it establishes a mysterious, intense base. The drama unfolds with the electric teal #00CED1, a striking violet #8A2BE2, and a fiery orange-red #FF4500. This palette is designed for projects that demand high impact, dynamic contrast, and a memorable visual story, perfect for evoking energy, mystery, and a cutting-edge feel.

Best used for

  • Sci-fi game environments
  • High-tech product launches
  • Extreme sports branding
  • Abstract digital art
  • Dark mode application themes
  • Event posters (dynamic, energetic)

Suggested color roles

primary

#0A0A2A (The deepest, near-black blue, ideal for foundational backgrounds or main content areas, conveying profound mystery.)

secondary

#36454F (A deep charcoal, suitable for secondary panels, navigation, or subtle layering.)

accent

#FF4500 (The fiery orange-red, perfect for calls to action, alerts, or conveying urgency and excitement.)

background

#0A0A2A (Provides an immersive, stark, and mysterious backdrop, allowing the vibrant accents to truly pop.)

text

#00CED1 (Excellent for headings and important text on dark backgrounds. For body text, a light grey or white (e.g., #F0F0F0) is recommended for optimal readability.)

Accessibility notes

  • #00CED1, #8A2BE2, and #FF4500 provide strong contrast against #0A0A2A and #36454F, making them suitable for interactive elements and headings.
  • Always use a light, high-contrast color (e.g., white or light grey) for body text on the darkest backgrounds to ensure WCAG compliance.
  • Exercise caution when using #8A2BE2 for text, as its vibrance might reduce readability for some users.
  • The vibrant accents should be tested for color blindness considerations when used for critical information.

Recommended combinations

Geothermal Core

Deep darks with electric teal for a mysterious and impactful foundation.

#0A0A2A · #36454F · #00CED1

Volcanic Burst

Stark contrast for highlighting key information or interactive elements with fiery energy.

#0A0A2A · #FF4500 · #8A2BE2

Dynamic Depths

Charcoal base with vibrant teal and orange-red for dynamic UI components and accents.

#36454F · #00CED1 · #FF4500

CSS variables

:root {
  --deep-sea-geothermal-2-1: #0A0A2A;
  --deep-sea-geothermal-2-2: #36454F;
  --deep-sea-geothermal-2-3: #00CED1;
  --deep-sea-geothermal-2-4: #8A2BE2;
  --deep-sea-geothermal-2-5: #FF4500;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-sea-geothermal-2": {
        1: "#0A0A2A",
        2: "#36454F",
        3: "#00CED1",
        4: "#8A2BE2",
        5: "#FF4500",
      }
    }
  }
}

Related searches

dark blue orange palettegeothermal color schemehigh contrast vibrant colorssci-fi dark mode uimysterious energetic web design

Palette colors

Hex values

Color 1#0A0A2A
·
Color 2#36454F
·
Color 3#00CED1
·
Color 4#8A2BE2
·
Color 5#FF4500
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
9.9:1AAA
3.2:1AA18
5.6:1AA
2
1.9:1Fail
5.1:1AA
1.7:1Fail
2.9:1Fail
3
9.9:1AAA
5.1:1AA
3:1AA18
1.8:1Fail
4
3.2:1AA18
1.7:1Fail
3:1AA18
1.7:1Fail
5
5.6:1AA
2.9:1Fail
1.8:1Fail
1.7:1Fail

Similar palettes

More like Deep Sea Geothermal

View all dark