Back to palettes

Palette

Volcanic Ash Fields

A stark, muted grayscale capturing the desolate beauty and raw power of volcanic ash landscapes.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#36454F#50585C#6C7074#8D9093#B0B3B6

Palette guide

How to use Volcanic Ash Fields

Overview

The "Volcanic Ash Fields" palette presents a stark, muted grayscale, capturing the desolate beauty and raw power of volcanic ash landscapes. This collection spans from the deep, cool #36454F to the gentle, light #B0B3B6, offering a versatile spectrum for nuanced design. The intermediate tones like #50585C, #6C7074, and #8D9093 provide ample opportunities for creating depth and visual hierarchy within a cohesive, cool-toned aesthetic. It's an excellent choice for designers seeking a serious, modern, and geological feel, providing a strong foundation for both dramatic and understated compositions in digital and print.

Best used for

  • Scientific or geological research websites
  • Minimalist product design interfaces
  • Professional corporate reports
  • Urban architectural visualization
  • Photography portfolios with a focus on textures
  • Technical documentation or software UI

Suggested color roles

primary

#36454F - A deep, cool blue-grey, ideal for foundational backgrounds, robust headers, or dramatic full-screen elements, establishing a strong, stable presence.

secondary

#50585C - A slightly lighter, versatile cool grey, perfect for secondary panels, card backgrounds, or primary text elements against lighter shades, adding depth.

accent

#B0B3B6 - The lightest, cool grey, excellent for subtle highlights, interactive states, or delicate graphic elements, providing a gentle lift and contrast.

background

#6C7074 - A balanced, cool mid-grey that serves as an elegant content background, allowing both darker and lighter elements to maintain clarity.

text

#B0B3B6 or near-white on darker backgrounds like #36454F or #50585C. For lighter backgrounds like #8D9093, a dark charcoal like #36454F ensures excellent readability.

Accessibility notes

  • Ensure sufficient contrast when using #8D9093 for text on mid-range greys like #6C7074.
  • Dark text, such as #36454F, on the light #B0B3B6 background provides optimal readability.
  • Avoid low-contrast combinations like #6C7074 text on a #50585C background for critical information.
  • Always verify WCAG AA contrast standards, especially for smaller font sizes and interactive elements.

Recommended combinations

Deep Mineral

Creates a robust, layered cool grey interface, ideal for primary content blocks, navigation, and structured data displays.

#36454F · #50585C · #6C7074

Muted Progression

Excellent for lighter sections, secondary content, or layered interfaces where a soft, cohesive transition between cool greys is desired.

#6C7074 · #8D9093 · #B0B3B6

Clear Readability

Uses the lightest grey for primary text against the darkest background, with a slightly lighter dark grey for supporting elements, ensuring clarity.

#36454F · #B0B3B6 · #50585C

CSS variables

:root {
  --volcanic-ash-fields-3-1: #36454F;
  --volcanic-ash-fields-3-2: #50585C;
  --volcanic-ash-fields-3-3: #6C7074;
  --volcanic-ash-fields-3-4: #8D9093;
  --volcanic-ash-fields-3-5: #B0B3B6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "volcanic-ash-fields-3": {
        1: "#36454F",
        2: "#50585C",
        3: "#6C7074",
        4: "#8D9093",
        5: "#B0B3B6",
      }
    }
  }
}

Related searches

cool grey monochrome palettegeological inspired colorsprofessional grey UI designstark mineral tonesmuted smoke grey palette

Palette colors

Hex values

Color 1#36454F
·
Color 2#50585C
·
Color 3#6C7074
·
Color 4#8D9093
·
Color 5#B0B3B6
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2:1Fail
3.1:1AA18
4.7:1AA
2
1.4:1Fail
1.5:1Fail
2.3:1Fail
3.4:1AA18
3
2:1Fail
1.5:1Fail
1.6:1Fail
2.4:1Fail
4
3.1:1AA18
2.3:1Fail
1.6:1Fail
1.5:1Fail
5
4.7:1AA
3.4:1AA18
2.4:1Fail
1.5:1Fail

Similar palettes

More like Volcanic Ash Fields

View all monochrome
Arctic Explorer Suit
Monochrome Paper Cuts
Monochrome Smoke Flow
Quartz Vein Refined
Smoky Charcoal Grill
Smoky Mountain Ridge