Back to palettes

Palette

Deep Volcanic Glass

Reflects the dark, smooth textures of obsidian and cooled volcanic glass.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Deep Volcanic Glass 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 Volcanic Glass.

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

Data visualization

#0A0A0A#2C2C2C#4A4A4A#7B7B7B#B8B8B8

Palette guide

How to use Deep Volcanic Glass

Overview

The Deep Volcanic Glass palette is a sophisticated monochrome collection that reflects the dark, smooth textures of obsidian and cooled volcanic glass. Ranging from the profound #0A0A0A to the deep #2C2C2C, it transitions through the balanced #4A4A4A and #7B7B7B, culminating in the lighter, yet still grounded #B8B8B8. This modern and minimal palette is perfect for designers seeking to convey strength, elegance, and understated power. Developers can utilize these versatile greys for sleek dark mode interfaces, high-tech branding, or any project that benefits from a clean, professional, and contemporary aesthetic, offering timeless visual appeal.

Best used for

  • Tech company websites or apps
  • Modern architectural portfolios
  • Minimalist UI designs
  • Luxury automotive branding
  • High-end product showcases
  • Professional corporate identities

Suggested color roles

primary

#0A0A0A - The foundational, deepest black, ideal for main backgrounds or creating strong visual anchors.

secondary

#2C2C2C - A rich, dark grey that works well for content panels, headers, or secondary navigational elements.

accent

#B8B8B8 - A light, sophisticated grey perfect for interactive elements, highlights, or subtle graphical accents.

background

#4A4A4A - A balanced mid-tone grey that can serve as a versatile background for content sections, offering good contrast for lighter text.

text

#B8B8B8 - Highly recommended for primary text against darker shades like #0A0A0A or #2C2C2C to ensure excellent readability.

Accessibility notes

  • Text in #B8B8B8 against #0A0A0A, #2C2C2C, or #4A4A4A will generally meet WCAG AA contrast standards.
  • Avoid using #7B7B7B for text on #4A4A4A as contrast may be insufficient for smaller font sizes.
  • For critical information, especially in smaller type, ensure the contrast ratio is robust, potentially opting for pure white text on the darkest backgrounds.
  • When using #7B7B7B on #B8B8B8, ensure the text is large enough or important information is highlighted with stronger contrast.

Recommended combinations

Obsidian Layers

To create deep, layered backgrounds or for a sophisticated visual hierarchy in dark mode designs.

#0A0A0A · #2C2C2C · #4A4A4A

Volcanic Highlight

Highlighting key information or interactive components, with #B8B8B8 providing clear distinction.

#2C2C2C · #B8B8B8 · #7B7B7B

Modern Contrast

Effective for clean branding or minimalist UI elements, offering a harmonious and professional grey scale.

#0A0A0A · #4A4A4A · #B8B8B8

CSS variables

:root {
  --deep-volcanic-glass-1: #0A0A0A;
  --deep-volcanic-glass-2: #2C2C2C;
  --deep-volcanic-glass-3: #4A4A4A;
  --deep-volcanic-glass-4: #7B7B7B;
  --deep-volcanic-glass-5: #B8B8B8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-volcanic-glass": {
        1: "#0A0A0A",
        2: "#2C2C2C",
        3: "#4A4A4A",
        4: "#7B7B7B",
        5: "#B8B8B8",
      }
    }
  }
}

Related searches

dark grey color paletteobsidian color schememinimalist black and greymodern UI grey colorsvolcanic rock aesthetic

Palette colors

Hex values

Color 1#0A0A0A
·
Color 2#2C2C2C
·
Color 3#4A4A4A
·
Color 4#7B7B7B
·
Color 5#B8B8B8
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2.2:1Fail
4.7:1AA
10:1AAA
2
1.4:1Fail
1.6:1Fail
3.3:1AA18
7:1AAA
3
2.2:1Fail
1.6:1Fail
2.1:1Fail
4.5:1AA18
4
4.7:1AA
3.3:1AA18
2.1:1Fail
2.1:1Fail
5
10:1AAA
7:1AAA
4.5:1AA18
2.1:1Fail

Similar palettes

More like Deep Volcanic Glass

View all dark
Obsidian Flow Edge
Charcoal Depths
Cosmic Void Depths
Midnight Stone Garden
Obsidian Crater Flow
Obsidian Shard Glimmer