Back to palettes

Palette

Berry Patch

A delicious collection of deep reds and vibrant pinks, inspired by ripe, juicy summer berries.

warmplayful5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#8B0000#B22222#DC143C#FF1493#FF69B4

Palette guide

How to use Berry Patch

Overview

The Berry Patch palette offers a delicious collection of deep reds and vibrant pinks, inspired by ripe, juicy summer berries. This inviting scheme features rich reds like #8B0000 and #B22222, transitioning to lively #DC143C and #FF1493, culminating in the soft #FF69B4. Each hex code contributes to a dynamic and inviting aesthetic, ideal for designs that aim to convey natural sweetness, vitality, and joyful energy. Designers and developers can utilize this palette to create engaging interfaces for food-related brands, vibrant editorial content, or joyful digital experiences, ensuring a memorable and visually appealing user journey that stands out with its unique color story.

Best used for

  • Sweet shop and confectionery branding
  • Children's product design
  • Vibrant e-commerce sites
  • Summer event promotions
  • Playful mobile app interfaces
  • Fashion and beauty content

Suggested color roles

primary

The lively #DC143C is excellent for impactful calls-to-action or headlines, demanding attention with its cheerful hue.

secondary

Deep #8B0000 can be used for navigation, footers, or background sections, providing a rich, stable base.

accent

The soft #FF69B4 serves as a powerful accent for interactive elements, small icons, or highlights to add a delicate, bright pop.

background

The warm #FF1493 provides an inviting, cheerful canvas, allowing the deeper berry tones to truly pop.

text

For lighter backgrounds like #FF69B4, use the deep #8B0000 or a rich dark red for body text. On darker backgrounds, #FF69B4 or white ensures readability.

Accessibility notes

  • Ensure sufficient contrast between #8B0000 text and #FF69B4 backgrounds for WCAG AA compliance.
  • Avoid using #FF69B4 on #FF1493 for small text without careful contrast checks, as they are close in value.
  • The close tonal range of reds and pinks 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

Juicy & Sweet

Ideal for hero sections and call-to-action blocks, creating a lively and clear visual hierarchy.

#8B0000 · #DC143C · #FF69B4

Berry Blush

Excellent for sophisticated branding, headers, and footers, providing depth with a crisp highlight.

#B22222 · #FF1493 · #FF69B4

Vibrant Red

Use for infographic elements or data visualization to differentiate categories vividly and playfully.

#DC143C · #FF1493 · #8B0000

CSS variables

:root {
  --berry-patch-1: #8B0000;
  --berry-patch-2: #B22222;
  --berry-patch-3: #DC143C;
  --berry-patch-4: #FF1493;
  --berry-patch-5: #FF69B4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "berry-patch": {
        1: "#8B0000",
        2: "#B22222",
        3: "#DC143C",
        4: "#FF1493",
        5: "#FF69B4",
      }
    }
  }
}

Related searches

vibrant berry red pinksweet fruit color schemeplayful summer palettelush red pink colorsjoyful food branding

Palette colors

Hex values

Color 1#8B0000
·
Color 2#B22222
·
Color 3#DC143C
·
Color 4#FF1493
·
Color 5#FF69B4
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2:1Fail
2.8:1Fail
3.8:1AA18
2
1.5:1Fail
1.3:1Fail
1.8:1Fail
2.5:1Fail
3
2:1Fail
1.3:1Fail
1.4:1Fail
1.9:1Fail
4
2.8:1Fail
1.8:1Fail
1.4:1Fail
1.4:1Fail
5
3.8:1AA18
2.5:1Fail
1.9:1Fail
1.4:1Fail

Similar palettes

More like Berry Patch

View all warm