Back to palettes

Palette

Figgy Pudding Spice

Rich, comforting tones of fig preserves spiced with autumn flavors, warm and inviting.

warmcalm5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Figgy Pudding Spice 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 Figgy Pudding Spice.

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

Data visualization

#F2DFCC#D4C0AE#B7A293#9C867C#7C6A66

Palette guide

How to use Figgy Pudding Spice

Overview

The Figgy Pudding Spice palette offers a sophisticated blend of warm, muted earth tones, perfect for creating inviting and comforting digital experiences. Anchored by a soft, creamy base (#F2DFCC) and deepening through rich mid-tones like #B7A293 and #9C867C, this collection evokes the cozy essence of autumn spices and fig preserves. Its gentle progression from light to deep, culminating in the grounding #7C6A66, makes it exceptionally versatile for UI/UX design, branding, and content creation. Designers will appreciate its ability to convey warmth without being overwhelming, while developers can implement these harmonious hex codes for a cohesive, natural aesthetic across various platforms.

Best used for

  • Branding for artisanal food products or cafes
  • Cozy blog or lifestyle websites focused on home and comfort
  • Interior design inspiration apps or decor e-commerce
  • Autumnal marketing campaigns and seasonal promotions
  • Food and beverage packaging design for gourmet items
  • E-commerce platforms for handcrafted goods or textiles

Suggested color roles

primary

#B7A293 serves as a warm, inviting base for main content areas or brand identity, offering a sophisticated earthy feel.

secondary

#D4C0AE provides a lighter, supportive tone for secondary elements, panels, or complementary sections, maintaining harmony.

accent

#7C6A66 should be reserved for small, impactful elements like call-to-action buttons, icons, or important highlights due to its depth.

background

#F2DFCC is ideal for a soft, creamy background, ensuring readability and a gentle, welcoming user experience.

text

#9C867C offers excellent readability for body text against lighter shades like #F2DFCC and #D4C0AE, providing a harmonious, soft contrast.

Accessibility notes

  • Ensure sufficient contrast when pairing lighter shades like #F2DFCC with text; aim for at least WCAG AA standards.
  • Use #7C6A66 or #9C867C for primary body text against #F2DFCC or #D4C0AE backgrounds to guarantee readability.
  • Avoid using #D4C0AE text on #B7A293 backgrounds for critical information, as contrast may be insufficient for some users.
  • Check button and link contrast carefully; #7C6A66 is a strong candidate for interactive elements on lighter backgrounds.

Recommended combinations

Warm Foundation

Excellent for primary content blocks, using #F2DFCC as background, #D4C0AE for secondary elements, and #9C867C for headlines or key text.

#F2DFCC · #D4C0AE · #9C867C

Earthy Depth

Ideal for creating depth in sections like sidebars, footers, or hero images, with #B7A293 as a base and #7C6A66 for strong accents.

#B7A293 · #9C867C · #7C6A66

Subtle UI

Perfect for UI components like cards, tabs, or navigation menus, where #D4C0AE provides the container, #B7A293 for selection states, and #7C6A66 for icons.

#D4C0AE · #B7A293 · #7C6A66

CSS variables

:root {
  --figgy-pudding-spice-1: #F2DFCC;
  --figgy-pudding-spice-2: #D4C0AE;
  --figgy-pudding-spice-3: #B7A293;
  --figgy-pudding-spice-4: #9C867C;
  --figgy-pudding-spice-5: #7C6A66;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "figgy-pudding-spice": {
        1: "#F2DFCC",
        2: "#D4C0AE",
        3: "#B7A293",
        4: "#9C867C",
        5: "#7C6A66",
      }
    }
  }
}

Related searches

figgy pudding color palettewarm earthy color schememuted autumn colorscozy brown color palettespice inspired design colors

Palette colors

Hex values

Color 1#F2DFCC
·
Color 2#D4C0AE
·
Color 3#B7A293
·
Color 4#9C867C
·
Color 5#7C6A66
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
1.9:1Fail
2.6:1Fail
3.9:1AA18
2
1.4:1Fail
1.4:1Fail
2:1Fail
2.9:1Fail
3
1.9:1Fail
1.4:1Fail
1.4:1Fail
2.1:1Fail
4
2.6:1Fail
2:1Fail
1.4:1Fail
1.5:1Fail
5
3.9:1AA18
2.9:1Fail
2.1:1Fail
1.5:1Fail

Similar palettes

More like Figgy Pudding Spice

View all warm
Saffron Ginger Brew
Spiced Tea Ceremony
Spiced Tea Comfort
Spiced Tea Ritual
Autumn Hearth Comfort
Autumn Spice Brew