Palette

Berry Compote Delight

A luscious palette reminiscent of warm berry compote bubbling with sweet, fruity flavors.

warmplayful5 colors

More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Berry Compote Delight 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 Berry Compote Delight.

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

Data visualization

#8A0303#C04343#D47979#A33535#EBC0BD

Palette guide

How to use Berry Compote Delight

Overview

The Berry Compote Delight palette is a luscious collection reminiscent of warm berry compote bubbling with sweet, fruity flavors. It features a range of inviting reds, from the deep #8A0303 and #A33535 to the vibrant #C04343 and the softer #D47979, all brightened by the delicate #EBC0BD. Each hex code contributes to a warm and playful aesthetic, ideal for designs that evoke comfort, home-cooked goodness, and a touch of rustic charm. Designers and developers can leverage this palette for food-related branding, cozy lifestyle blogs, or charming e-commerce sites, ensuring a visually appealing and emotionally resonant user experience. It's particularly effective for conveying warmth and sweetness in digital and print media.

Best used for

Homemade food product packaging
Recipe blogs and culinary websites
Café and bistro branding
Autumn and holiday marketing
Cozy home decor accents
Sweet treat promotions

Suggested color roles

primary

The rich #C04343 is excellent for main headings or calls-to-action, offering a warm and inviting focal point.

secondary

Deep #8A0303 can be used for navigation, footers, or background sections, providing a strong, elegant foundation.

accent

The soft #EBC0BD serves as a delicate accent for backgrounds, subtle gradients, or decorative flourishes, adding lightness.

background

The gentle #D47979 provides a warm, approachable base that is gentle on the eyes and complements the deeper tones.

text

For lighter backgrounds like #EBC0BD, use the deep #8A0303 or a rich dark brown for body text. On darker backgrounds, #EBC0BD or a very light gray ensures readability.

Accessibility notes

Ensure sufficient contrast between #8A0303 text and #EBC0BD backgrounds for WCAG AA compliance.
Avoid using #D47979 on #C04343 for small text without careful contrast checks, as they are close in value.
The close tonal range of reds may require careful contrast checks for interactive elements.
Always test color combinations with accessibility tools to meet WCAG standards, especially for text and interactive elements.

Recommended combinations

Rich & Sweet

Ideal for elegant branding, header sections, and content blocks, providing depth with a soft highlight.

#8A0303 · #C04343 · #EBC0BD

Warm Indulgence

Excellent for highlighting promotions, call-to-action buttons, and festive elements, conveying warmth and joy.

#A33535 · #D47979 · #EBC0BD

Compote Blend

Use for visual storytelling, smooth transitions, or decorative elements that require a flowing, appetizing aesthetic.

#C04343 · #D47979 · #8A0303

CSS variables

:root {
  --berry-compote-delight-1: #8A0303;
  --berry-compote-delight-2: #C04343;
  --berry-compote-delight-3: #D47979;
  --berry-compote-delight-4: #A33535;
  --berry-compote-delight-5: #EBC0BD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "berry-compote-delight": {
        1: "#8A0303",
        2: "#C04343",
        3: "#D47979",
        4: "#A33535",
        5: "#EBC0BD",
      }
    }
  }
}

Hex values

Color 1#8A0303

Color 2#C04343

Color 3#D47979

Color 4#A33535

Color 5#EBC0BD

Accessibility

Contrast checker

2:1Fail

3.3:1AA18

1.5:1Fail

6.1:1AA

2:1Fail

1.7:1Fail

1.3:1Fail

3.1:1AA18

3.3:1AA18

1.7:1Fail

2.2:1Fail

1.9:1Fail

1.5:1Fail

1.3:1Fail

2.2:1Fail

4.1:1AA18

6.1:1AA

3.1:1AA18

1.9:1Fail

4.1:1AA18

Similar palettes

More like Berry Compote Delight

Frosted Berry Crumble