Palette

Autumn Harvest Hearth

Embraces the comforting warmth and rich colors of a crackling fire during an abundant autumn harvest.

warmnatural5 colors

More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Autumn Harvest Hearth 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 Autumn Harvest Hearth.

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

Data visualization

#8B0000#A52A2A#CD5C5C#DAA520#BDB76B

Palette guide

How to use Autumn Harvest Hearth

Overview

The "Autumn Harvest Hearth" palette embraces the comforting warmth and rich colors of a crackling fire during an abundant autumn harvest. It features the intense, deep reds of #8B0000 and #A52A2A, alongside the softer coral-red of #CD5C5C. These are beautifully complemented by the radiant golden yellow of #DAA520 and the muted olive-gold of #BDB76B. This collection is perfect for designs aiming to evoke natural warmth, rustic comfort, and a sense of inviting coziness. Designers and developers can utilize these harmonious hues for creating inviting interfaces, organic branding, or evocative seasonal content.

Best used for

Cozy home and lifestyle blogs
Rustic cabin or lodge branding
Autumnal event invitations and decor
Seasonal food and beverage marketing
User interfaces with a warm, comforting feel
Digital art and illustrations of hearths and harvests

Suggested color roles

primary

#A52A2A - A rich, earthy red-brown that serves as an excellent focal point for branding, call-to-action buttons, or main headings.

secondary

#DAA520 - A radiant golden yellow that provides a luminous supporting role for subheadings, highlights, or secondary navigation.

accent

#CD5C5C - A soft, warm coral-red that adds a gentle touch, perfect for interactive elements, icons, or subtle decorative details.

background

#BDB76B - A muted olive-gold that offers a unique, earthy base, allowing reds and brighter golds to stand out.

text

#8B0000 - An intense, deep red that provides excellent contrast against lighter shades like #BDB76B, ensuring high readability for body text.

Accessibility notes

Ensure sufficient contrast for text, especially when using #DAA520 or #CD5C5C on #BDB76B.
Use #8B0000 or a deep charcoal/black for body text on #BDB76B to meet WCAG AA standards.
Avoid using #A52A2A for small text on #8B0000 due to potential readability issues.
Test interactive elements for clear visual feedback and sufficient contrast in all states.

Recommended combinations

Hearth Glow

Creates a warm, earthy gradient from olive-gold to red-brown, ideal for backgrounds or soft visual elements.

#BDB76B · #DAA520 · #A52A2A

Firelight Contrast

Combines deep red with a soft coral and bright gold for striking contrast and a festive, warm feel.

#8B0000 · #CD5C5C · #DAA520

Rustic Warmth

A harmonious blend of red-brown, golden yellow, and olive-gold, excellent for creating inviting sections or visual accents.

#A52A2A · #DAA520 · #BDB76B

CSS variables

:root {
  --autumn-harvest-hearth-2-1: #8B0000;
  --autumn-harvest-hearth-2-2: #A52A2A;
  --autumn-harvest-hearth-2-3: #CD5C5C;
  --autumn-harvest-hearth-2-4: #DAA520;
  --autumn-harvest-hearth-2-5: #BDB76B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "autumn-harvest-hearth-2": {
        1: "#8B0000",
        2: "#A52A2A",
        3: "#CD5C5C",
        4: "#DAA520",
        5: "#BDB76B",
      }
    }
  }
}

Hex values

Color 1#8B0000

Color 2#A52A2A

Color 3#CD5C5C

Color 4#DAA520

Color 5#BDB76B

Accessibility

Contrast checker

1.4:1Fail

2.5:1Fail

4.5:1AA18

4.8:1AA

1.4:1Fail

1.8:1Fail

3.2:1AA18

3.4:1AA18

2.5:1Fail

1.8:1Fail

1.9:1Fail

4.5:1AA18

3.2:1AA18

1.8:1Fail

1.1:1Fail

4.8:1AA

3.4:1AA18

1.9:1Fail

1.1:1Fail

Similar palettes

More like Autumn Harvest Hearth

Autumn Harvest Hearth

See it in context.

Ready when you are.

Built with Autumn Harvest Hearth.

How to use Autumn Harvest Hearth

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Hearth Glow

Firelight Contrast

Rustic Warmth

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Autumn Harvest Hearth