Back to palettes

Palette

Volcanic Ash Glaze

A stark, textured gradient of grays inspired by the raw, smoky beauty of volcanic ash and rock.

MonochromeDark5 colors
More Monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Volcanic Ash Glaze 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 Ash Glaze.

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

Data visualization

#212121#424242#616161#9E9E9E#BDBDBD

Palette guide

How to use Volcanic Ash Glaze

Overview

The Volcanic Ash Glaze palette offers a stark, textured gradient of greys, inspired by the raw, smoky beauty of volcanic ash and rock. Ranging from a deep, near-black charcoal (#212121) to a soft, luminous light grey (#BDBDBD), this monochrome collection provides immense depth and sophistication. The intermediate shades (#424242, #616161, #9E9E9E) allow for meticulous layering and subtle visual hierarchy. This palette is perfect for designers seeking a minimalist, modern, and professional aesthetic, particularly for dark mode interfaces, high-tech branding, or any project where elegance, clarity, and a strong visual foundation are paramount without the distraction of color.

Best used for

  • Professional dark mode applications
  • High-tech brand identity
  • Minimalist website design
  • Architectural visualization
  • Luxury product interfaces
  • Photography website backgrounds

Suggested color roles

primary

#212121 - The darkest shade, ideal for main backgrounds, headers, or large hero sections, providing a powerful and sleek foundation.

secondary

#424242 - A strong dark grey for secondary content areas, card backgrounds, or navigation elements, offering subtle differentiation.

accent

#BDBDBD - The lightest shade, perfect for subtle highlights, interactive elements, or key text that needs to stand out against darker greys.

background

#616161 - A versatile mid-tone grey that can serve as a primary content background, offering a soft, approachable feel.

text

#BDBDBD - Excellent for primary text on darker backgrounds like #212121 or #424242, ensuring crisp readability.

Accessibility notes

  • Ensure #BDBDBD text on #212121 or #424242 backgrounds meets WCAG AA contrast.
  • Avoid using adjacent greys like #616161 and #9E9E9E for small body text due to potentially low contrast.
  • Test interactive elements for clear visual feedback, especially hover/focus states.
  • For light mode, use #212121 for text on #BDBDBD to maintain strong contrast.

Recommended combinations

Deep Monochrome

A stark dark background with light text and a slightly lighter dark grey for secondary elements, creating a strong contrast.

#212121 · #BDBDBD · #424242

Ash Layers

Layered greys for depth in UI components, creating a subtle and sophisticated visual hierarchy.

#424242 · #616161 · #9E9E9E

Bright Contrast

A light-medium grey background with dark text, accented by the lightest grey for highlights and interactive elements.

#9E9E9E · #212121 · #BDBDBD

CSS variables

:root {
  --volcanic-ash-glaze-6-1: #212121;
  --volcanic-ash-glaze-6-2: #424242;
  --volcanic-ash-glaze-6-3: #616161;
  --volcanic-ash-glaze-6-4: #9E9E9E;
  --volcanic-ash-glaze-6-5: #BDBDBD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "volcanic-ash-glaze-6": {
        1: "#212121",
        2: "#424242",
        3: "#616161",
        4: "#9E9E9E",
        5: "#BDBDBD",
      }
    }
  }
}

Related searches

monochromatic grey themedark ash grey paletteminimalist black greyraw volcanic greysleek dark mode colors

Palette colors

Hex values

Color 1#212121
·
Color 2#424242
·
Color 3#616161
·
Color 4#9E9E9E
·
Color 5#BDBDBD
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.6:1Fail
6:1AA
8.6:1AAA
2
1.6:1Fail
1.6:1Fail
3.8:1AA18
5.3:1AA
3
2.6:1Fail
1.6:1Fail
2.3:1Fail
3.3:1AA18
4
6:1AA
3.8:1AA18
2.3:1Fail
1.4:1Fail
5
8.6:1AAA
5.3:1AA
3.3:1AA18
1.4:1Fail

Similar palettes

More like Volcanic Ash Glaze

View all Monochrome
Cyber Rain Puddle
Deep Space Blackout
Digital Ghost Glitch
Espresso Bean Roast
Volcanic Obsidian Edge
Abyssal Pearl Gleam