Back to palettes

Palette

Volcanic Ash Dawn

A stark gradient of greys, depicting the subdued and somber light of dawn over a landscape of volcanic ash.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#2E2E2E#4A4A4A#6C6C6C#909090#B4B4B4

Palette guide

How to use Volcanic Ash Dawn

Overview

The "Volcanic Ash Dawn" palette presents a striking monochrome gradient, capturing the subdued light of dawn over an ash-covered landscape. This collection of greys, ranging from the deep #2E2E2E to the lighter #B4B4B4, offers a sophisticated and minimalist foundation for a variety of design applications. The mid-tones like #4A4A4A, #6C6C6C, and #909090 provide ample flexibility for layering and creating visual hierarchy without introducing additional hues. It's an excellent choice for designers aiming for a clean, modern, and serious aesthetic, ensuring clarity and an understated elegance in digital and print media.

Best used for

  • Modern minimalist website designs
  • Dark mode UI/UX applications
  • High-tech product branding
  • Architectural firm portfolios
  • Photography and art exhibition themes
  • Professional corporate dashboards

Suggested color roles

primary

#2E2E2E - A deep, commanding charcoal, ideal for primary backgrounds, headers, or robust structural elements, providing a strong anchor.

secondary

#4A4A4A - A slightly lighter, versatile dark grey, perfect for secondary panels, card backgrounds, or prominent text against lighter shades.

accent

#B4B4B4 - The lightest grey, serving as a subtle accent for highlights, hover states, or fine details against darker greys, adding gentle contrast.

background

#6C6C6C - A balanced mid-grey that can serve as an elegant, neutral background for content, allowing both darker and lighter elements to stand out.

text

#B4B4B4 or near-white on darker backgrounds like #2E2E2E or #4A4A4A. For lighter backgrounds like #909090, a dark charcoal like #2E2E2E ensures readability.

Accessibility notes

  • Ensure sufficient contrast when using #909090 or #B4B4B4 for text on mid-range greys like #6C6C6C.
  • Dark text, such as #2E2E2E, on light backgrounds like #B4B4B4 offers good readability.
  • Avoid low-contrast combinations like #6C6C6C text on a #4A4A4A background for critical information.
  • Always check WCAG AA contrast ratios, especially for smaller font sizes and interactive elements.

Recommended combinations

Deep Layers

Creates a sophisticated, dark layered interface, ideal for depth in dashboards, modals, or complex information display.

#2E2E2E · #4A4A4A · #6C6C6C

Subtle Contrast

Excellent for sections requiring less intensity, like secondary content areas or background patterns, offering gentle visual separation.

#6C6C6C · #909090 · #B4B4B4

High Readability

Maximizes contrast for text and primary elements, using the lightest grey for text against the darkest for backgrounds, with a mid-tone for emphasis.

#2E2E2E · #B4B4B4 · #4A4A4A

CSS variables

:root {
  --volcanic-ash-dawn-1: #2E2E2E;
  --volcanic-ash-dawn-2: #4A4A4A;
  --volcanic-ash-dawn-3: #6C6C6C;
  --volcanic-ash-dawn-4: #909090;
  --volcanic-ash-dawn-5: #B4B4B4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "volcanic-ash-dawn": {
        1: "#2E2E2E",
        2: "#4A4A4A",
        3: "#6C6C6C",
        4: "#909090",
        5: "#B4B4B4",
      }
    }
  }
}

Related searches

dark grey monochrome paletteminimalist UI greysash tone color schemeprofessional dark mode colorsgradient grey design

Palette colors

Hex values

Color 1#2E2E2E
·
Color 2#4A4A4A
·
Color 3#6C6C6C
·
Color 4#909090
·
Color 5#B4B4B4
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.6:1Fail
4.3:1AA18
6.5:1AA
2
1.5:1Fail
1.7:1Fail
2.8:1Fail
4.3:1AA18
3
2.6:1Fail
1.7:1Fail
1.6:1Fail
2.5:1Fail
4
4.3:1AA18
2.8:1Fail
1.6:1Fail
1.5:1Fail
5
6.5:1AA
4.3:1AA18
2.5:1Fail
1.5:1Fail

Similar palettes

More like Volcanic Ash Dawn

View all monochrome
Granite Quarry Scale
Ancient Volcanic Ash
Volcanic Ash Bloom
Volcanic Ash Glaze
Ash Cloud Layers
Basalt Rock Formation