Back to palettes

Palette

Volcanic Hearth Warmth

Robust and warm, these shades capture the ancient, smoldering heat and rich earth tones of a volcanic hearth.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Volcanic Hearth Warmth 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 Hearth Warmth.

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

Data visualization

#8B4513#A0522D#CD5C5C#B22222#654321

Palette guide

How to use Volcanic Hearth Warmth

Overview

The Volcanic Hearth Warmth palette offers a robust and grounded collection of earthy reds and browns, reminiscent of a smoldering, ancient hearth. This scheme exudes a sense of natural strength and cozy warmth, perfect for designs that aim for a rustic or heritage feel. Key colors include the deep, rich brown #8B4513, the inviting reddish-brown #A0522D, and the strong, foundational red #B22222. Designers and developers can utilize this palette to craft experiences that feel authentic, durable, and comforting, whether for digital interfaces or physical products, creating a timeless and earthy aesthetic.

Best used for

  • Rustic and heritage brand identities
  • Natural and organic product packaging
  • Cozy interior design and home decor themes
  • Outdoor adventure and durable goods branding
  • Traditional craftsmanship and artisanal websites
  • Autumnal or comfort-food related marketing

Suggested color roles

primary

Utilize #B22222 as a strong, dominant red for impactful headlines or main call-to-action elements.

secondary

Apply #A0522D for supporting content, background sections, or secondary navigation, providing earthy richness.

accent

Use #CD5C5C for softer highlights, decorative elements, or interactive states, adding a touch of warmth without overwhelming.

background

Employ #654321 as a deep, grounding background color for a stable and natural foundation.

text

For dark backgrounds like #654321 or #8B4513, use white or a light cream. For lighter shades like #CD5C5C, a dark brown or charcoal provides good contrast.

Accessibility notes

  • Ensure sufficient contrast for text on #CD5C5C and #A0522D, as these mid-tones might challenge readability.
  • Pairing #8B4513 with #654321 for text should be avoided due to low contrast; use lighter text instead.
  • Always test text legibility on background colors, particularly for small font sizes.
  • Consider using a bolder font weight for text on similar hues within the palette to improve readability.

Recommended combinations

Earthy Base

Creates a deep, natural gradient perfect for backgrounds or rich textures.

#654321 · #8B4513 · #A0522D

Warm Hearth

Combines reds with an earthy tone for a cozy, inviting feel in featured sections.

#B22222 · #CD5C5C · #A0522D

Rustic Accent

Offers a strong, warm contrast for highlighting important information or calls-to-action.

#8B4513 · #CD5C5C · #B22222

CSS variables

:root {
  --volcanic-hearth-warmth-1: #8B4513;
  --volcanic-hearth-warmth-2: #A0522D;
  --volcanic-hearth-warmth-3: #CD5C5C;
  --volcanic-hearth-warmth-4: #B22222;
  --volcanic-hearth-warmth-5: #654321;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "volcanic-hearth-warmth": {
        1: "#8B4513",
        2: "#A0522D",
        3: "#CD5C5C",
        4: "#B22222",
        5: "#654321",
      }
    }
  }
}

Related searches

earthy red brown paletterustic design colorswarm natural tonesheritage brand colorscozy interior palette

Palette colors

Hex values

Color 1#8B4513
·
Color 2#A0522D
·
Color 3#CD5C5C
·
Color 4#B22222
·
Color 5#654321
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.8:1Fail
1.1:1Fail
1.2:1Fail
2
1.3:1Fail
1.4:1Fail
1.2:1Fail
1.6:1Fail
3
1.8:1Fail
1.4:1Fail
1.7:1Fail
2.2:1Fail
4
1.1:1Fail
1.2:1Fail
1.7:1Fail
1.3:1Fail
5
1.2:1Fail
1.6:1Fail
2.2:1Fail
1.3:1Fail

Similar palettes

More like Volcanic Hearth Warmth

View all earth
Autumn Wood Glade
Burnt Siena
Canyon Clay Whisper
Canyon Wall Terracotta
Desert Jasper Vein
Dusty Canyon Trails