Fall color palettes

Where fall palettes work

• Autumn retail campaigns and back-to-school promotions
• Recipe, baking, and café sites
• Harvest festival, Thanksgiving, and autumn event pages
• Editorial features and photo stories with a seasonal theme

Three families of fall color

Nearly half of the swatches here are oranges, from pale apricot to rust, and another sixth are reds. They group into three recognizable families:

• Harvest: saturated pumpkin and apricot on cream, such as #fdeedc, #ffd8a9, #f1a661, #e38b29.
• Faded: dusty mauve, taupe, and parchment, such as #65647c, #8b7e74, #c7bca1, #f1d3b3.
• Dusk: slate with copper, such as #2c3639, #3f4e4f, #a27b5c, #dcd7c9, which works well as a dark theme.

Assign rust, ochre, and moss one job each

Fall palettes contain several strong colors of similar weight, so give each a fixed role. In the harvest set, #fdeedc is the page and #ffd8a9 the card. The pumpkin #e38b29 is the most visible color, but white text on it measures only 2.63:1. Put dark text on it (black reaches 7.99:1) or add a deeper rust such as #8a3b12 for links and buttons with white labels; #8a3b12 measures 6.79:1 on #fdeedc and 5.76:1 on #ffd8a9.

If you add a moss green, keep it for secondary tags or illustration so it does not compete with the main action.

:root {
  --bg: #fdeedc;
  --card: #ffd8a9;
  --highlight: #e38b29; /* fills with dark text */
  --action: #8a3b12;    /* added: links, buttons */
}

The dusk set as a dark theme

With #2c3639 as the base, the parchment #dcd7c9 becomes body text at 8.62:1. The copper #a27b5c is 3.26:1 on the base, so it works for borders, icons, and large headings, not paragraphs. #3f4e4f fills cards; parchment text on it is still 6.05:1.

Pairing the colors

Choose one rust or pumpkin for actions, a cream or parchment for surfaces, and slate or dark brown for text. Olive and plum work as secondary colors for tags and illustration. For a dark version, slate #2c3639 with copper #a27b5c is a ready-made pair.

Contrast and readability

Faded fall sets look soft but often contain usable text colors. In #fff8ea, #9e7676, #815b5b, #594545, the darkest brown gives 8.41:1 on the cream and #815b5b gives 5.55:1, but #9e7676 is 3.74:1, so keep it for borders and large type. Dusty mauve #ac7088 holds white text at only 3.87:1.

Questions

What colors go with burnt orange?

Cream and parchment (#fdeedc, #dcd7c9) for surfaces, slate or charcoal (#2c3639) for contrast, and muted olive or moss as a secondary color. Avoid pairing it with a bright red of similar lightness, as the two blur together.

What is the difference between fall and earth palettes?

Fall palettes are warmer and more saturated, at about 55% HSL saturation on average against 42% for earth, and they center on orange and rust. Earth palettes are greyer and more often include a cool mineral color such as slate or pale blue. About a third of fall palettes also appear in the earth collection.

Can I use orange as a primary button color?

Yes, with care. Mid oranges like #e38b29 need a dark label, and orange can be confused with warning states. If warnings use orange elsewhere in the product, give them an icon and text, or use the deeper rust for actions.