Back to palettes

Palette

Volcanic Ash Glaze

Cool, stark greys capture the rugged textures and muted beauty of volcanic ash landscapes.

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

#2C363F#4C5B6F#7E909B#B1C2CB#D6DDEC

Palette guide

How to use Volcanic Ash Glaze

Overview

The Volcanic Ash Glaze palette offers a range of cool, stark greys that capture the rugged textures and muted beauty of volcanic ash landscapes. From a deep, almost navy-grey (#2C363F) to a very light, ethereal grey (#D6DDEC), this palette provides a harmonious gradient. The intermediate shades (#4C5B6F, #7E909B, #B1C2CB) allow for smooth transitions and sophisticated layering. Ideal for designs seeking a calm, clean, and professional aesthetic, it's particularly suited for interfaces, branding, or editorial content that benefits from a natural, unobtrusive feel. This palette helps convey stability, clarity, and understated elegance, allowing content to truly shine.

Best used for

  • Professional services websites
  • Cloud computing interfaces
  • Educational platforms
  • Scientific research presentations
  • Minimalist interior design concepts
  • Clean tech product branding

Suggested color roles

primary

#2C363F - A deep, anchoring grey for main backgrounds, headers, or large text blocks, conveying stability and depth.

secondary

#4C5B6F - A strong mid-dark grey for secondary content areas, card backgrounds, or navigation, providing gentle contrast.

accent

#B1C2CB - A versatile light-medium grey for subtle highlights, interactive elements, or key information that needs to stand out softly.

background

#D6DDEC - The lightest shade, perfect for clean content backgrounds, cards, or sections requiring high readability for dark text.

text

#2C363F - Dark text on light backgrounds like #D6DDEC. For text on darker backgrounds, use a crisp white or #D6DDEC for optimal readability.

Accessibility notes

  • Ensure #2C363F text on #D6DDEC backgrounds meets WCAG AA contrast.
  • Avoid using adjacent greys like #4C5B6F and #7E909B for small body text; use for larger headings or UI elements.
  • Test interactive elements for clear visual feedback, especially hover/focus states.
  • For dark mode, use #D6DDEC for text on #2C363F to ensure strong contrast.

Recommended combinations

Ash Depth

A deep grey background with a very light text and a mid-dark grey for secondary elements, creating a clear, sophisticated hierarchy.

#2C363F · #D6DDEC · #4C5B6F

Cool Layers

Layered cool greys for subtle depth in UI components, ideal for clean, modern interfaces.

#4C5B6F · #7E909B · #B1C2CB

Light Contrast

A light background with dark text and a medium grey for accents, ensuring excellent readability and a calm aesthetic.

#D6DDEC · #2C363F · #7E909B

CSS variables

:root {
  --volcanic-ash-glaze-1: #2C363F;
  --volcanic-ash-glaze-2: #4C5B6F;
  --volcanic-ash-glaze-3: #7E909B;
  --volcanic-ash-glaze-4: #B1C2CB;
  --volcanic-ash-glaze-5: #D6DDEC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "volcanic-ash-glaze": {
        1: "#2C363F",
        2: "#4C5B6F",
        3: "#7E909B",
        4: "#B1C2CB",
        5: "#D6DDEC",
      }
    }
  }
}

Related searches

cool grey monotone palettevolcanic rock greyclean ash color schemeprofessional grey bluemuted natural greys

Palette colors

Hex values

Color 1#2C363F
·
Color 2#4C5B6F
·
Color 3#7E909B
·
Color 4#B1C2CB
·
Color 5#D6DDEC
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.8:1Fail
3.7:1AA18
6.7:1AA
9:1AAA
2
1.8:1Fail
2.1:1Fail
3.8:1AA18
5.1:1AA
3
3.7:1AA18
2.1:1Fail
1.8:1Fail
2.4:1Fail
4
6.7:1AA
3.8:1AA18
1.8:1Fail
1.3:1Fail
5
9:1AAA
5.1:1AA
2.4:1Fail
1.3:1Fail

Similar palettes

More like Volcanic Ash Glaze

View all monochrome