Back to palettes

Palette

Autumn Maple Leaf

Rich, fiery hues celebrate the dramatic transformation of maple leaves during the crisp autumn season.

warmnatural5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#B22222#FF4500#DAA520#A52A2A#8B4513

Palette guide

How to use Autumn Maple Leaf

Overview

The Autumn Maple Leaf palette celebrates the dramatic transformation of maple leaves with rich, fiery hues. It features a strong red (#B22222) and a vibrant orange-red (#FF4500), embodying intense fall colors. A golden yellow (#DAA520) adds a sunny, warming glow, while deep brown-red (#A52A2A) and saddle brown (#8B4513) provide grounding, earthy depth. This palette is incredibly useful for designers and developers aiming to create projects with warmth, energy, and a strong connection to nature. From impactful seasonal campaigns and rustic website themes to engaging digital illustrations and cozy branding, these hex codes offer a comprehensive range to capture the breathtaking beauty and comfort of autumn.

Best used for

  • Seasonal marketing and advertising
  • Nature-inspired website themes
  • Cozy brand identity
  • Autumn-themed event promotions
  • Digital art and landscape illustrations
  • Rustic e-commerce product displays

Suggested color roles

primary

Utilize #B22222 as a commanding primary color for brand logos or key calls-to-action, signifying passion and warmth.

secondary

Employ #FF4500 for secondary headings or important sub-sections, offering a vibrant, energetic tone.

accent

Highlight interactive elements or critical information with #DAA520 to draw immediate attention with a golden glow.

background

A light, near-white background allows the richness of #B22222 and #FF4500 to stand out prominently.

text

For optimal readability, use #8B4513 for body text on lighter backgrounds, or a crisp white on darker tones.

Accessibility notes

  • Ensure sufficient contrast between #8B4513 text and #DAA520 background for WCAG AA compliance.
  • Avoid using #FF4500 text on #DAA520 backgrounds without careful contrast checking due to similar luminosity.
  • Test button and link states for clear visual distinction, especially within the red-orange spectrum.
  • Consider alternative indicators for critical information if relying solely on color contrast between #B22222 and #A52A2A.

Recommended combinations

Earthy Ember

Creates a deep, grounded base with a contrasting golden highlight, excellent for footers or strong headers.

#8B4513 · #A52A2A · #DAA520

Fiery Dynamics

Ideal for impactful calls-to-action or vibrant graphic elements that need to stand out boldly.

#B22222 · #FF4500 · #A52A2A

Warm Glow

Perfect for a warm background with deep text and a vibrant supporting color, suitable for content cards or alerts.

#DAA520 · #8B4513 · #FF4500

CSS variables

:root {
  --autumn-maple-leaf-1: #B22222;
  --autumn-maple-leaf-2: #FF4500;
  --autumn-maple-leaf-3: #DAA520;
  --autumn-maple-leaf-4: #A52A2A;
  --autumn-maple-leaf-5: #8B4513;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "autumn-maple-leaf": {
        1: "#B22222",
        2: "#FF4500",
        3: "#DAA520",
        4: "#A52A2A",
        5: "#8B4513",
      }
    }
  }
}

Related searches

maple leaf color schemefiery autumn palettered orange gold hexfall forest designcozy seasonal colors

Palette colors

Hex values

Color 1#B22222
·
Color 2#FF4500
·
Color 3#DAA520
·
Color 4#A52A2A
·
Color 5#8B4513
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
3:1Fail
1.1:1Fail
1.1:1Fail
2
1.9:1Fail
1.5:1Fail
2.1:1Fail
2.1:1Fail
3
3:1Fail
1.5:1Fail
3.2:1AA18
3.2:1AA18
4
1.1:1Fail
2.1:1Fail
3.2:1AA18
1:1Fail
5
1.1:1Fail
2.1:1Fail
3.2:1AA18
1:1Fail

Similar palettes

More like Autumn Maple Leaf

View all warm
Autumn Cider Spill
Autumn Leaf Rustle
Autumn Orchard Gold
Spiced Cider Evening
Spiced Cider Warmth
Autumn Cider Festival