Back to palettes

Palette

Volcanic Ash Ridge

A stark, minimalist palette reflecting the raw, powerful beauty of a volcanic landscape with its ash-covered ridges.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#3A3B3C#5A5A5A#8D8D8D#C0C0C0#2A2B2C

Palette guide

How to use Volcanic Ash Ridge

Overview

The "Volcanic Ash Ridge" palette, with its stark and minimalist range of grays, captures the raw, powerful beauty of a volcanic landscape. This monochrome collection offers a seamless gradient from the almost black #2A2B2C to the light, stony #C0C0C0, including versatile mid-tones like #5A5A5A and #8D8D8D. Designers can leverage these sophisticated grays to create elegant, understated interfaces, corporate branding, or architectural visualizations that demand precision and professionalism. The deep #3A3B3C provides a strong anchoring point, making the palette highly adaptable for both dark and light UI themes, ensuring a consistent and refined aesthetic.

Best used for

  • High-end corporate branding
  • Architectural and interior design portfolios
  • Minimalist web and app interfaces
  • Photography and art gallery websites
  • Luxury product packaging
  • Modern tech company branding

Suggested color roles

primary

#3A3B3C - A deep, almost black gray, ideal for main content areas, headers, or primary navigation, providing a solid anchor.

secondary

#5A5A5A - A versatile mid-dark gray, perfect for subheadings, secondary buttons, or borders, offering subtle contrast.

accent

#C0C0C0 - The lightest gray, excellent for subtle highlights, interactive states, or delicate outlines against darker elements.

background

#2A2B2C - The darkest shade, creating a sophisticated and immersive dark mode background or a strong foundation for design.

text

#C0C0C0 - For clear, readable text on dark backgrounds, or a deep charcoal like #2A2B2C for body text on lighter background elements.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially when using #8D8D8D on #5A5A5A for small text.
  • Body text should ideally use #C0C0C0 on #2A2B2C or #3A3B3C for optimal readability in dark themes.
  • Avoid relying solely on subtle shade differences (e.g., #3A3B3C vs. #2A2B2C) to convey important information.
  • Test contrast ratios for interactive elements to ensure they are clearly distinguishable for all users.

Recommended combinations

Deep Monochrome

Creates a dramatic dark theme with strong readability for primary text.

#2A2B2C · #3A3B3C · #C0C0C0

Grayscale Professional

Excellent for lighter UI elements, subheadings, and subtle visual hierarchy.

#5A5A5A · #8D8D8D · #C0C0C0

Stark Contrast

Use darkest for background, lightest for main text, and mid-tone for secondary details.

#2A2B2C · #C0C0C0 · #5A5A5A

CSS variables

:root {
  --volcanic-ash-ridge-1: #3A3B3C;
  --volcanic-ash-ridge-2: #5A5A5A;
  --volcanic-ash-ridge-3: #8D8D8D;
  --volcanic-ash-ridge-4: #C0C0C0;
  --volcanic-ash-ridge-5: #2A2B2C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "volcanic-ash-ridge": {
        1: "#3A3B3C",
        2: "#5A5A5A",
        3: "#8D8D8D",
        4: "#C0C0C0",
        5: "#2A2B2C",
      }
    }
  }
}

Related searches

minimalist gray palettevolcanic rock colorsdark monochrome schemeelegant gray brandingprofessional dark mode colors

Palette colors

Hex values

Color 1#3A3B3C
·
Color 2#5A5A5A
·
Color 3#8D8D8D
·
Color 4#C0C0C0
·
Color 5#2A2B2C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
3.4:1AA18
6.2:1AA
1.3:1Fail
2
1.6:1Fail
2.1:1Fail
3.8:1AA18
2.1:1Fail
3
3.4:1AA18
2.1:1Fail
1.8:1Fail
4.3:1AA18
4
6.2:1AA
3.8:1AA18
1.8:1Fail
7.8:1AAA
5
1.3:1Fail
2.1:1Fail
4.3:1AA18
7.8:1AAA

Similar palettes

More like Volcanic Ash Ridge

View all monochrome
Ancient Volcanic Ash
Volcanic Ash Bloom
Volcanic Ash Dawn
Volcanic Ash Drift
Volcanic Ash Glaze
Volcanic Ash Glaze