Back to palettes

Palette

Fiery Volcanic Ash

Deep greys and blacks contrast with searing oranges and molten reds, capturing the raw power of glowing lava and ash.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#2A2A2A#4F4F4F#E65F00#8B1A10#6B4F42

Palette guide

How to use Fiery Volcanic Ash

Overview

The Fiery Volcanic Ash palette captures the raw power of a volcanic landscape, blending deep, somber tones with intense, molten hues. Featuring a rich dark grey, #2A2A2A, alongside a lighter ash grey, #4F4F4F, it sets a dramatic stage. The vibrant orange, #E65F00, and deep, smoldering red, #8B1A10, inject fiery energy, while the warm brown, #6B4F42, grounds the scheme. This palette is ideal for projects demanding a powerful, intense, and slightly rugged aesthetic, perfect for conveying strength and a primal energy. Designers can leverage its stark contrasts for impactful visual narratives and compelling user experiences.

Best used for

  • Gaming UI for action or adventure titles
  • Brand identity for outdoor gear or extreme sports
  • Movie posters or trailers for intense dramas
  • Dark mode themes for tech applications
  • Website backgrounds for heavy metal bands or industrial design
  • Event branding for powerful, high-energy experiences

Suggested color roles

primary

#2A2A2A (Deep background or dominant structural elements, providing a solid, dark foundation for intensity.)

secondary

#4F4F4F (Used for secondary sections, borders, or subtle textural elements, offering contrast to the primary dark.)

accent

#E65F00 (Highlighting calls to action, interactive elements, or key information to draw immediate attention.)

background

#2A2A2A (Creates a dramatic, immersive backdrop, suitable for dark themes or strong brand presence.)

text

#E65F00 (For headings or important text on dark backgrounds, providing high visibility. For body text, consider a very light grey or white for readability.)

Accessibility notes

  • Ensure sufficient contrast between #E65F00 or #8B1A10 and the dark backgrounds like #2A2A2A for text readability.
  • Avoid using #4F4F4F for small text on #2A2A2A as contrast might be insufficient for WCAG AA.
  • When using #8B1A10 as text, pair it with a very light background, or use it sparingly for large, decorative text.
  • Consider using a lighter text color, such as white or light grey, on #2A2A2A and #4F4F4F for optimal readability in body copy.

Recommended combinations

Lava Flow

Ideal for a bold header, showcasing intense action or critical alerts against a dark canvas.

#2A2A2A · #E65F00 · #8B1A10

Ash & Ember

Suitable for detailed infographics or data visualizations, offering warmth and clarity on a muted base.

#4F4F4F · #6B4F42 · #E65F00

Deep Core

Excellent for subtle background textures or section dividers, providing depth without distraction.

#2A2A2A · #6B4F42 · #4F4F4F

CSS variables

:root {
  --fiery-volcanic-ash-1: #2A2A2A;
  --fiery-volcanic-ash-2: #4F4F4F;
  --fiery-volcanic-ash-3: #E65F00;
  --fiery-volcanic-ash-4: #8B1A10;
  --fiery-volcanic-ash-5: #6B4F42;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "fiery-volcanic-ash": {
        1: "#2A2A2A",
        2: "#4F4F4F",
        3: "#E65F00",
        4: "#8B1A10",
        5: "#6B4F42",
      }
    }
  }
}

Related searches

dark volcanic color schemelava and ash paletteintense earth tonesmolten rock color ideasrugged design colors

Palette colors

Hex values

Color 1#2A2A2A
·
Color 2#4F4F4F
·
Color 3#E65F00
·
Color 4#8B1A10
·
Color 5#6B4F42
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.8:1Fail
4.1:1AA18
1.5:1Fail
1.9:1Fail
2
1.8:1Fail
2.3:1Fail
1.1:1Fail
1.1:1Fail
3
4.1:1AA18
2.3:1Fail
2.7:1Fail
2.1:1Fail
4
1.5:1Fail
1.1:1Fail
2.7:1Fail
1.3:1Fail
5
1.9:1Fail
1.1:1Fail
2.1:1Fail
1.3:1Fail

Similar palettes

More like Fiery Volcanic Ash

View all dark
Obsidian Flow Texture
Magma Flow Descent
Volcanic Caldera Ember
Basalt Ridge Shadow
Crater Lake Depth
Lava Flow Ember