Back to palettes

Palette

Volcanic Ash Fields

A monochrome journey through the stark, subtle beauty of volcanic ash and rock in muted tones.

darkminimal5 colors
More dark 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

#2C3539#50585B#787E7D#A3A3A3#1E2325

Palette guide

How to use Volcanic Ash Fields

Overview

The "Volcanic Ash Fields" palette takes you on a monochrome journey through the stark, subtle beauty of ash and rock. This collection of deep, muted greys, ranging from the profound #1E2325 to the lighter #A3A3A3, offers a sophisticated and minimalist foundation. The intermediate tones, #2C3539, #50585B, and #787E7D, provide ample flexibility for layering and creating visual hierarchy within a cohesive dark aesthetic. It's an excellent choice for designers aiming for a clean, modern, and serious feel, ensuring clarity and an understated elegance in digital and print media, perfect for conveying raw, natural power.

Best used for

  • High-end technology company branding
  • Dark mode interfaces for professional tools
  • Documentary film title sequences
  • Architectural visualization projects
  • Minimalist e-commerce for luxury goods
  • Photography showcasing dramatic landscapes

Suggested color roles

primary

#1E2325 - An exceptionally deep, almost black charcoal, ideal for robust backgrounds, headers, or foundational structural elements, establishing a powerful anchor.

secondary

#2C3539 - A deep, cool grey, perfect for secondary panels, card backgrounds, or primary text elements against lighter shades, adding depth.

accent

#A3A3A3 - The lightest, neutral grey, excellent for subtle highlights, interactive states, or delicate graphic elements, providing a gentle lift.

background

#50585B - A balanced, cool dark grey that serves as a sophisticated content background, allowing both darker and lighter elements to maintain clarity.

text

#A3A3A3 or near-white on darker backgrounds like #1E2325 or #2C3539. For lighter backgrounds like #787E7D, a dark charcoal like #1E2325 ensures excellent readability.

Accessibility notes

  • Ensure sufficient contrast when using #787E7D or #A3A3A3 for text on mid-range greys like #50585B.
  • Dark text, such as #1E2325, on the light #A3A3A3 background provides optimal readability.
  • Avoid low-contrast combinations like #50585B text on a #2C3539 background for critical information.
  • Always verify WCAG AA contrast standards, especially for smaller font sizes and interactive elements.

Recommended combinations

Deep Abyss

Creates a powerful, immersive dark theme, ideal for hero sections, main navigation, or content blocks requiring strong visual weight.

#1E2325 · #2C3539 · #50585B

Subtle Gradation

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

#50585B · #787E7D · #A3A3A3

High Contrast

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

#1E2325 · #A3A3A3 · #2C3539

CSS variables

:root {
  --volcanic-ash-fields-2-1: #2C3539;
  --volcanic-ash-fields-2-2: #50585B;
  --volcanic-ash-fields-2-3: #787E7D;
  --volcanic-ash-fields-2-4: #A3A3A3;
  --volcanic-ash-fields-2-5: #1E2325;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "volcanic-ash-fields-2": {
        1: "#2C3539",
        2: "#50585B",
        3: "#787E7D",
        4: "#A3A3A3",
        5: "#1E2325",
      }
    }
  }
}

Related searches

dark monochrome grey paletteminimalist ash field colorsprofessional cool grey UImuted dark earth tonesstark grey web design

Palette colors

Hex values

Color 1#2C3539
·
Color 2#50585B
·
Color 3#787E7D
·
Color 4#A3A3A3
·
Color 5#1E2325
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
3:1AA18
5:1AA
1.3:1Fail
2
1.7:1Fail
1.8:1Fail
2.9:1Fail
2.2:1Fail
3
3:1AA18
1.8:1Fail
1.6:1Fail
3.8:1AA18
4
5:1AA
2.9:1Fail
1.6:1Fail
6.3:1AA
5
1.3:1Fail
2.2:1Fail
3.8:1AA18
6.3:1AA

Similar palettes

More like Volcanic Ash Fields

View all dark