Back to palettes

Palette

Fallen Leaves

A rich tapestry of reds, oranges, and deep browns, mimicking the vibrant colors of autumn foliage.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Fallen Leaves 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 Fallen Leaves.

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

Data visualization

#8B0000#B22222#D2691E#FF8C00#BDB76B

Palette guide

How to use Fallen Leaves

Overview

The Fallen Leaves palette presents a rich tapestry of reds, oranges, and deep browns, mimicking the vibrant colors of autumn foliage. This earthy collection features a deep red #8B0000, a warm #B22222 (Firebrick), a rustic orange-brown #D2691E, and a bright #FF8C00 (Dark Orange). The muted olive #BDB76B adds a natural, grounding contrast. Designers and developers will find this scheme genuinely useful for creating designs that evoke a sense of warmth, nostalgia, and the natural beauty of the fall season, perfect for rustic or nature-inspired projects.

Best used for

  • Rustic home decor and interior design
  • Vintage-inspired branding and packaging
  • Natural food and beverage labels
  • Outdoor adventure gear marketing
  • Autumn festival promotions and flyers
  • Traditional crafts and artisanal products

Suggested color roles

primary

Use #D2691E (Chocolate Orange) as the main earthy color for backgrounds, large content areas, or primary branding.

secondary

Employ #FF8C00 (Dark Orange) for vibrant highlights, calls-to-action, or to add a cheerful, energetic pop.

accent

Apply #BDB76B (Dark Khaki) for natural contrast, subtle details, or to introduce a muted, organic element.

background

Utilize #B22222 (Firebrick) as a rich, deep background, providing a strong foundation for lighter text.

text

For optimal readability, use white or light cream for text on darker backgrounds. Dark brown or black text works well on #BDB76B.

Accessibility notes

  • Ensure high contrast for text; white or light text is essential on #8B0000, #B22222, #D2691E, and #FF8C00.
  • Avoid using similar dark colors for interactive elements without additional visual cues to distinguish them.
  • Test color combinations carefully, as many shades are deep and require sufficient luminance contrast for text.
  • The #BDB76B may require dark text to ensure readability, especially for body copy.

Recommended combinations

Earthy Foundation

Ideal for natural backgrounds, textural elements, or sections emphasizing warmth and organic qualities.

#D2691E · #BDB76B · #B22222

Golden Hour

Perfect for accents, calls-to-action, or elements that need to convey a warm, glowing highlight.

#FF8C00 · #D2691E · #BDB76B

Deep Autumn

Effective for strong branding, impactful visuals, or designs that require a rich and cohesive fall aesthetic.

#8B0000 · #B22222 · #D2691E

CSS variables

:root {
  --fallen-leaves-1: #8B0000;
  --fallen-leaves-2: #B22222;
  --fallen-leaves-3: #D2691E;
  --fallen-leaves-4: #FF8C00;
  --fallen-leaves-5: #BDB76B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "fallen-leaves": {
        1: "#8B0000",
        2: "#B22222",
        3: "#D2691E",
        4: "#FF8C00",
        5: "#BDB76B",
      }
    }
  }
}

Related searches

rustic autumn palettedeep fall colorsearthy foliage schemenatural red orangevintage fall leaves

Palette colors

Hex values

Color 1#8B0000
·
Color 2#B22222
·
Color 3#D2691E
·
Color 4#FF8C00
·
Color 5#BDB76B
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.8:1Fail
4.3:1AA18
4.8:1AA
2
1.5:1Fail
1.8:1Fail
2.9:1Fail
3.2:1AA18
3
2.8:1Fail
1.8:1Fail
1.6:1Fail
1.8:1Fail
4
4.3:1AA18
2.9:1Fail
1.6:1Fail
1.1:1Fail
5
4.8:1AA
3.2:1AA18
1.8:1Fail
1.1:1Fail

Similar palettes

More like Fallen Leaves

View all earth
Autumn Canopy
Autumn Leaf Canopy
Autumn Wood Glade
Forest Floor Canvas
Forest Floor Whispers
Mystical Forest Floor