Back to palettes

Palette

Volcanic Obsidian Edge

A dramatic blend of deep charcoal and molten earth tones, inspired by powerful volcanic landscapes.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Volcanic Obsidian Edge 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 Volcanic Obsidian Edge.

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

Data visualization

#1A1A1A#36454F#5D4D3A#778899#6B8E23

Palette guide

How to use Volcanic Obsidian Edge

Overview

The Volcanic Obsidian Edge palette presents a dramatic blend of deep charcoal and molten earth tones, complemented by a striking organic green. Inspired by powerful volcanic landscapes, this scheme offers sophistication and a grounded, natural feel. Key colors include the deep #1A1A1A, the cool grey-blue #36454F, the warm earth-grey #5D4D3A, and the vibrant #6B8E23. This palette is excellent for designers seeking a unique dark theme with a touch of natural accent. Developers can apply these colors to create luxurious dark mode interfaces, tech-focused designs, or branding that evokes both strength and environmental consciousness.

Best used for

  • Luxury and sophisticated tech brands
  • Outdoor adventure and gear companies
  • Dark mode interfaces and applications
  • Environmental and sustainability initiatives
  • Masculine product branding and packaging
  • Contemporary interior design concepts

Suggested color roles

primary

Utilize #36454F as a deep, cool grey-blue for primary content areas or main navigation.

secondary

Apply #5D4D3A for supporting elements, subheadings, or background sections, adding earthy warmth.

accent

Highlight key information or interactive elements with the striking #6B8E23 to add a vibrant, organic pop.

background

Employ #1A1A1A as a deep, stable black background for maximum contrast and sophistication.

text

For dark backgrounds, use light grey or white. For #778899, use dark charcoal or black for optimal readability.

Accessibility notes

  • Ensure sufficient contrast when placing text on #778899; light text may blend in.
  • The #6B8E23 accent color needs high contrast text (e.g., black or white) to be legible.
  • Avoid using #1A1A1A and #36454F for text and background in small elements due to lower contrast.
  • Test all color pairings for WCAG AA compliance, especially for interactive elements and critical information.

Recommended combinations

Deep Earth

Creates a sophisticated dark to light gradient with a natural, earthy feel.

#1A1A1A · #5D4D3A · #778899

Obsidian Accent

Provides a strong, dark base with a vibrant, organic green highlight for key features.

#1A1A1A · #36454F · #6B8E23

Subtle Contrast

A harmonious blend of greys for subtle depth and differentiation in content blocks.

#36454F · #5D4D3A · #778899

CSS variables

:root {
  --volcanic-obsidian-edge-2-1: #1A1A1A;
  --volcanic-obsidian-edge-2-2: #36454F;
  --volcanic-obsidian-edge-2-3: #5D4D3A;
  --volcanic-obsidian-edge-2-4: #778899;
  --volcanic-obsidian-edge-2-5: #6B8E23;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "volcanic-obsidian-edge-2": {
        1: "#1A1A1A",
        2: "#36454F",
        3: "#5D4D3A",
        4: "#778899",
        5: "#6B8E23",
      }
    }
  }
}

Related searches

dark earthy paletteobsidian green colorssophisticated dark modenature tech brandingdramatic neutral scheme

Palette colors

Hex values

Color 1#1A1A1A
·
Color 2#36454F
·
Color 3#5D4D3A
·
Color 4#778899
·
Color 5#6B8E23
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.8:1Fail
2.1:1Fail
4.8:1AA
4.6:1AA
2
1.8:1Fail
1.2:1Fail
2.7:1Fail
2.6:1Fail
3
2.1:1Fail
1.2:1Fail
2.2:1Fail
2.1:1Fail
4
4.8:1AA
2.7:1Fail
2.2:1Fail
1:1Fail
5
4.6:1AA
2.6:1Fail
2.1:1Fail
1:1Fail

Similar palettes

More like Volcanic Obsidian Edge

View all dark
Volcanic Ash
Volcanic Obsidian Edge
Basalt Edge
Charred Earth Legacy
Cosmic Void Depths
Crater Lake Depth