Palette

Spiced Pumpkin Patch

Warm, inviting colors reminiscent of harvest season, spices, and cozy pumpkin patches.

warmnatural5 colors

More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Spiced Pumpkin Patch 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 Pumpkin Patch.

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

Data visualization

#FADCBF#EAA87A#C26B29#9A4B1A#5C2E0C

Palette guide

How to use Spiced Pumpkin Patch

Overview

The Spiced Pumpkin Patch palette offers a warm, inviting, and deep autumn feel, progressing beautifully from light creams to rich, grounding browns. With the delicate #FADCBF, the inviting #C26B29, and the profound #5C2E0C, this collection is perfect for designs that aim for sophistication, rustic charm, or natural elegance. Designers can leverage its gradient-like quality for visually smooth transitions, while developers will appreciate the clear contrast opportunities for creating accessible and engaging user interfaces. The palette ensures a comforting and refined aesthetic suitable for various applications.

Best used for

sophisticated web design themes
interior decor and furnishing
luxury branding for natural products
editorial photography layouts
natural cosmetics packaging
artisanal food and beverage labels

Suggested color roles

primary

Use #C26B29 as a rich, inviting mid-tone for primary elements or main content sections.

secondary

Apply #EAA87A for supporting elements, offering a warm, soft orange complement.

accent

Introduce #9A4B1A as a deep, grounding brown accent for subtle details or anchors.

background

Employ #FADCBF for a very light, creamy background that provides excellent readability for darker text.

text

Utilize #5C2E0C for primary text on light backgrounds to ensure strong contrast and a deep, earthy anchor.

Accessibility notes

Ensure #FADCBF is always paired with sufficiently dark text for readability.
When using #EAA87A for text, ensure it's large enough or on a darker background to meet contrast standards.
Avoid using #C26B29 for small text on very dark backgrounds without careful contrast verification.
Provide clear visual cues for interactive elements, especially those using lighter shades.

Recommended combinations

Deepening Harvest

Creates a beautiful gradient-like progression, ideal for backgrounds or layered elements.

#FADCBF · #C26B29 · #5C2E0C

Rustic Elegance

Offers a warm and refined feel, perfect for headers or prominent visual blocks.

#EAA87A · #9A4B1A · #C26B29

Subtle Warmth

A soft and inviting combination, great for secondary information, subtle branding, or web elements.

#FADCBF · #EAA87A · #C26B29

CSS variables

:root {
  --spiced-pumpkin-patch-8-1: #FADCBF;
  --spiced-pumpkin-patch-8-2: #EAA87A;
  --spiced-pumpkin-patch-8-3: #C26B29;
  --spiced-pumpkin-patch-8-4: #9A4B1A;
  --spiced-pumpkin-patch-8-5: #5C2E0C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "spiced-pumpkin-patch-8": {
        1: "#FADCBF",
        2: "#EAA87A",
        3: "#C26B29",
        4: "#9A4B1A",
        5: "#5C2E0C",
      }
    }
  }
}

Hex values

Color 1#FADCBF

Color 2#EAA87A

Color 3#C26B29

Color 4#9A4B1A

Color 5#5C2E0C

Accessibility

Contrast checker

1.5:1Fail

3:1Fail

4.7:1AA

8.7:1AAA

1.5:1Fail

1.9:1Fail

3.1:1AA18

5.6:1AA

3:1Fail

1.9:1Fail

1.6:1Fail

2.9:1Fail

4.7:1AA

3.1:1AA18

1.6:1Fail

1.8:1Fail

8.7:1AAA

5.6:1AA

2.9:1Fail

1.8:1Fail

Similar palettes

More like Spiced Pumpkin Patch

View all warm

Pumpkin Spice Harvest

Spiced Autumn Equinox

Autumn Cider

Autumn Harvest Hearth

Autumn Leaf Fall

Autumn Leaf Rustle