Palette

Spiced Amber Grove

Rich, autumnal shades evoke the scent of spices drifting through a grove of amber-colored trees.

warmnatural5 colors

More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Spiced Amber Grove 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 Spiced Amber Grove.

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

Data visualization

#B25A00#D97E00#FFA31A#FFCC80#803D00

Palette guide

How to use Spiced Amber Grove

Overview

The Spiced Amber Grove palette evokes rich, autumnal shades, reminiscent of spices drifting through amber-colored trees. This vibrant collection features deep #803D00, robust #B25A00, warm #D97E00, radiant #FFA31A, and a soft #FFCC80. It’s perfect for designs that aim to convey natural warmth, autumnal charm, and a sense of inviting richness. Designers can leverage these hues for authentic branding, welcoming web interfaces, or soft, elegant print materials. Developers will find this palette excellent for creating visually cohesive and accessible user experiences, especially for projects related to natural products, seasonal themes, or cozy home aesthetics, ensuring a timeless and inviting feel.

Best used for

Autumnal event marketing or seasonal campaigns
Organic food and beverage branding or packaging
Rustic home decor blogs or e-commerce sites
Harvest festival promotional materials
Nature-themed photography portfolios or art projects
Brand identity for craft breweries or coffee shops

Suggested color roles

primary

Use #B25A00 for primary calls to action or key headings, providing a rich, inviting focal point.

secondary

Apply #D97E00 for supporting content, subheadings, or as a background for sections that need a warmer, approachable feel.

accent

Introduce #FFCC80 as a soft accent for subtle highlights, interactive elements, or to add a touch of luminous glow.

background

Employ #FFA31A for vibrant, immersive backgrounds that convey energy and warmth, or pair with a near-white for high contrast content areas.

text

Utilize #803D00 for body text and headings on lighter backgrounds, ensuring excellent readability and a harmonious earthy aesthetic. A crisp white is essential on dark backgrounds.

Accessibility notes

Ensure sufficient contrast between the lightest color #FFCC80 and any text placed upon it, targeting WCAG AA.
Pair #803D00 or #B25A00 with white or very light text for optimal readability on darker backgrounds.
Avoid using #D97E00 text on #FFA31A backgrounds due to potential low contrast for smaller text.
Clearly define interactive states with more than just color changes, considering users with color vision deficiencies.

Recommended combinations

Amber Glow

Ideal for creating soft, luminous backgrounds or subtle gradients that evoke warmth and light, perfect for headers.

#FFCC80 · #FFA31A · #D97E00

Grove Depth

Excellent for establishing a grounded, rich foundation in headers, footers, or main content blocks, conveying depth.

#803D00 · #B25A00 · #D97E00

Spiced Leaves

Use for highlighting product features, calls to action, or decorative elements that require a touch of vibrant warmth and contrast.

#FFA31A · #B25A00 · #803D00

CSS variables

:root {
  --spiced-amber-grove-1: #B25A00;
  --spiced-amber-grove-2: #D97E00;
  --spiced-amber-grove-3: #FFA31A;
  --spiced-amber-grove-4: #FFCC80;
  --spiced-amber-grove-5: #803D00;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "spiced-amber-grove": {
        1: "#B25A00",
        2: "#D97E00",
        3: "#FFA31A",
        4: "#FFCC80",
        5: "#803D00",
      }
    }
  }
}

Hex values

Color 1#B25A00

Color 2#D97E00

Color 3#FFA31A

Color 4#FFCC80

Color 5#803D00

Accessibility

Contrast checker

1.6:1Fail

2.4:1Fail

3.3:1AA18

1.7:1Fail

1.6:1Fail

1.5:1Fail

2:1Fail

2.7:1Fail

2.4:1Fail

1.5:1Fail

1.4:1Fail

4.1:1AA18

3.3:1AA18

2:1Fail

1.4:1Fail

5.5:1AA

1.7:1Fail

2.7:1Fail

4.1:1AA18

5.5:1AA

Similar palettes

More like Spiced Amber Grove

Autumn Harvest Spices

Autumn Spice Blend