Back to palettes

Palette

Autumn Leaf Rustle

Warm, fiery reds and deep browns, celebrating the vibrant change of fall foliage.

warmnatural5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Autumn Leaf Rustle 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 Leaf Rustle.

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

Data visualization

#B22222#DAA520#A0522D#8B4513#CD5C5C

Palette guide

How to use Autumn Leaf Rustle

Overview

The Autumn Leaf Rustle palette presents a rich and cozy collection of warm tones, perfectly capturing the essence of fall foliage. Dominated by a robust red (#B22222) and complemented by a goldenrod (#DAA520), it provides a classic autumnal feel. Deep russet (#A0522D) and saddle brown (#8B4513) add earthy depth, while a lighter Indian red (#CD5C5C) offers a softer touch. This palette is excellent for designers and developers aiming to evoke warmth, comfort, and natural beauty in their projects. From seasonal branding to inviting digital interfaces and festive print materials, these hex codes deliver a consistent and appealing aesthetic that resonates with the cozy spirit of autumn.

Best used for

  • Cozy seasonal branding
  • Harvest festival promotions
  • Nature-inspired web design
  • Rustic product packaging
  • Autumn-themed digital art
  • Comfort-focused interior decor mockups

Suggested color roles

primary

Utilize #B22222 as a strong primary color for impactful headlines or brand logos, conveying warmth and energy.

secondary

Employ #DAA520 for secondary elements like subheadings or highlights, adding a touch of golden autumn glow.

accent

Use #CD5C5C for interactive elements or calls-to-action to provide a vibrant yet harmonious accent.

background

A lighter, neutral background (e.g., a very light beige or cream) would allow these rich colors to truly pop.

text

For optimal readability, use #8B4513 for body text on lighter backgrounds, or a dark charcoal on #CD5C5C.

Accessibility notes

  • Ensure sufficient contrast when using #CD5C5C text on a light background, or #DAA520 on #CD5C5C.
  • Pair #B22222 or #8B4513 with very light backgrounds for clear text readability, meeting WCAG AA standards.
  • Avoid placing #DAA520 directly on #CD5C5C for crucial information due to potential low contrast for some users.
  • Test all text and interactive element color combinations for contrast, especially in the red-brown spectrum.

Recommended combinations

Earthy Depth

Perfect for creating a natural, grounded feel in footers, sidebars, or rustic design elements.

#8B4513 · #A0522D · #DAA520

Vibrant Fall

Ideal for eye-catching banners, festive graphics, or calls-to-action that demand attention.

#B22222 · #CD5C5C · #DAA520

Cozy Contrast

Use for a warm background with deep text and a vibrant accent, suitable for blog posts or product descriptions.

#DAA520 · #8B4513 · #B22222

CSS variables

:root {
  --autumn-leaf-rustle-1: #B22222;
  --autumn-leaf-rustle-2: #DAA520;
  --autumn-leaf-rustle-3: #A0522D;
  --autumn-leaf-rustle-4: #8B4513;
  --autumn-leaf-rustle-5: #CD5C5C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "autumn-leaf-rustle": {
        1: "#B22222",
        2: "#DAA520",
        3: "#A0522D",
        4: "#8B4513",
        5: "#CD5C5C",
      }
    }
  }
}

Related searches

fall color trendscozy autumn palettered and gold color schemeearthy brown red hexnatural fall design

Palette colors

Hex values

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

Accessibility

Contrast checker

1
2
3
4
5
1
3:1Fail
1.2:1Fail
1.1:1Fail
1.7:1Fail
2
3:1Fail
2.5:1Fail
3.2:1AA18
1.8:1Fail
3
1.2:1Fail
2.5:1Fail
1.3:1Fail
1.4:1Fail
4
1.1:1Fail
3.2:1AA18
1.3:1Fail
1.8:1Fail
5
1.7:1Fail
1.8:1Fail
1.4:1Fail
1.8:1Fail

Similar palettes

More like Autumn Leaf Rustle

View all warm