Back to palettes

Palette

Volcano Ash Veins

A powerful mix of deep grays and fiery, smoldering reds, evoking a volcano's raw, primal energy.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Volcano Ash Veins 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 Volcano Ash Veins.

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

Data visualization

#2F4F4F#696969#A9A9A9#8B0000#4A0404

Palette guide

How to use Volcano Ash Veins

Overview

The Volcano Ash Veins palette combines deep, muted greys with intense, smoldering reds, capturing the raw, primal energy of a volcanic landscape. Featuring the cool #2F4F4F and #696969 balanced with the dramatic #8B0000 and #4A0404, alongside the lighter #A9A9A9, this collection is both powerful and atmospheric. It's ideal for designers and developers aiming to create a sense of mystery, drama, or rugged elegance. This palette effectively evokes imagery of ash-covered terrain with veins of molten rock, perfect for projects requiring a strong, earthy, and intense mood.

Best used for

  • Dark mode UI themes
  • Heavy metal album covers
  • Dramatic photography backdrops
  • Gothic or fantasy game environments
  • Industrial design branding
  • Mystery novel covers

Suggested color roles

primary

Use #2F4F4F as a dominant, deep and mysterious base for backgrounds or primary content areas.

secondary

Apply #696969 for supporting elements, offering a softer contrast to the darker greys.

accent

Reserve #8B0000 for impactful calls-to-action, alerts, or to signify importance and danger.

background

Employ #4A0404 for a deep, almost black-red background that provides a powerful, smoldering canvas.

text

For optimal readability, use #A9A9A9 or white text on the darker shades, and a dark charcoal for text on #A9A9A9.

Accessibility notes

  • Ensure sufficient contrast when using #696969 text on #2F4F4F or #4A0404 backgrounds.
  • The dark reds #8B0000 and #4A0404 require very light text (e.g., white or #A9A9A9) for readability.
  • Avoid using the darker greys for small text against the dark red hues without checking contrast ratios.
  • Test color combinations with accessibility tools to ensure all critical text and UI elements are legible.

Recommended combinations

Ash & Ember

Creates a brooding, intense atmosphere, ideal for backgrounds that need to convey depth and danger.

#4A0404 · #2F4F4F · #8B0000

Smoldering Grey

Provides a balanced, cool grey gradient, excellent for content blocks and subtle UI elements.

#2F4F4F · #696969 · #A9A9A9

Fiery Vein

Perfect for highlighting key information or interactive elements with a striking red against dark.

#4A0404 · #8B0000 · #A9A9A9

CSS variables

:root {
  --volcano-ash-veins-1: #2F4F4F;
  --volcano-ash-veins-2: #696969;
  --volcano-ash-veins-3: #A9A9A9;
  --volcano-ash-veins-4: #8B0000;
  --volcano-ash-veins-5: #4A0404;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "volcano-ash-veins": {
        1: "#2F4F4F",
        2: "#696969",
        3: "#A9A9A9",
        4: "#8B0000",
        5: "#4A0404",
      }
    }
  }
}

Related searches

volcano ash palettedark red greysmoldering colorsdramatic earth tonesgothic industrial palette

Palette colors

Hex values

Color 1#2F4F4F
·
Color 2#696969
·
Color 3#A9A9A9
·
Color 4#8B0000
·
Color 5#4A0404
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
3.8:1AA18
1.1:1Fail
1.8:1Fail
2
1.6:1Fail
2.3:1Fail
1.8:1Fail
2.9:1Fail
3
3.8:1AA18
2.3:1Fail
4.3:1AA18
6.8:1AA
4
1.1:1Fail
1.8:1Fail
4.3:1AA18
1.6:1Fail
5
1.8:1Fail
2.9:1Fail
6.8:1AA
1.6:1Fail

Similar palettes

More like Volcano Ash Veins

View all dark
Obsidian Peak Dusk
Volcanic Cinder Cone
Volcanic Ember Flow
Ancient Forest Depths
Charred Ember Still
Crimson Sunset Cloud