Palette

Autumn Harvest Berry

A comforting blend of colors inspired by the rich bounty and cozy feel of an autumn orchard.

warmnatural5 colors

More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#8B0000#B22222#DAA520#CD853F#F0E68C

Palette guide

How to use Autumn Harvest Berry

Overview

The "Autumn Harvest Berry" palette offers a comforting blend of colors inspired by the rich bounty and cozy feel of an autumn orchard. It features the intense, deep red of #8B0000 and the fiery red of #B22222. These are beautifully complemented by the radiant golden yellow of #DAA520, the warm sandy brown of #CD853F, and the soft, luminous pale gold of #F0E68C. This collection is perfect for designs aiming to evoke natural warmth, rustic charm, and a sense of comforting abundance. Designers and developers can utilize these harmonious hues for creating inviting interfaces, organic branding, or evocative seasonal content.

Best used for

Farm-to-table restaurant branding
Autumnal themed weddings or events
Cozy lifestyle blogs and websites
Seasonal fruit and berry product packaging
User interfaces with a warm, rustic feel
Digital art and illustrations of orchards

Suggested color roles

primary

#B22222 - A rich, fiery red 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

#CD853F - A warm, sandy brown that adds an earthy touch, perfect for interactive elements, icons, or subtle decorative details.

background

#F0E68C - A soft, luminous pale gold that offers a gentle, inviting base, ensuring content clarity and a cozy feel.

text

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

Accessibility notes

Ensure sufficient contrast for text, especially when using #DAA520 or #CD853F on #F0E68C, which may be challenging for readability.
Use #8B0000 or a deep charcoal/black for body text on #F0E68C to meet WCAG AA standards.
Avoid using #B22222 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

Orchard Glow

Creates a luminous, warm gradient from pale gold to sandy brown, ideal for backgrounds or soft visual elements.

#F0E68C · #DAA520 · #CD853F

Berry Rich

Combines deep reds with a light pale gold for striking contrast and a robust, autumnal feel.

#8B0000 · #B22222 · #F0E68C

Harvest Blend

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

#B22222 · #DAA520 · #CD853F

CSS variables

:root {
  --autumn-harvest-berry-2-1: #8B0000;
  --autumn-harvest-berry-2-2: #B22222;
  --autumn-harvest-berry-2-3: #DAA520;
  --autumn-harvest-berry-2-4: #CD853F;
  --autumn-harvest-berry-2-5: #F0E68C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "autumn-harvest-berry-2": {
        1: "#8B0000",
        2: "#B22222",
        3: "#DAA520",
        4: "#CD853F",
        5: "#F0E68C",
      }
    }
  }
}

Hex values

Color 1#8B0000

Color 2#B22222

Color 3#DAA520

Color 4#CD853F

Color 5#F0E68C

Accessibility

Contrast checker

1.5:1Fail

4.5:1AA18

3.3:1AA18

7.8:1AAA

1.5:1Fail

3:1Fail

2.2:1Fail

5.2:1AA

4.5:1AA18

3:1Fail

1.3:1Fail

1.7:1Fail