Back to palettes

Palette

Patisserie Macaron Assortment

A delightful collection of soft, sweet pastel colors reminiscent of gourmet French macarons.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Patisserie Macaron Assortment 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 Patisserie Macaron Assortment.

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

Data visualization

#F8C4C4#FFDAB9#B0E0E6#DDA0DD#E0FFFF

Palette guide

How to use Patisserie Macaron Assortment

Overview

This Patisserie Macaron Assortment palette delivers a delightful array of soft, sweet pastels, perfect for creating inviting and gentle digital experiences. Featuring the warm blush of #F8C4C4, the creamy peach of #FFDAB9, and the serene aqua of #B0E0E6, this collection exudes a sense of playful elegance. Developers can leverage these hues for interfaces that require a light, airy touch, such as lifestyle blogs or creative e-commerce sites. The soft lilac of #DDA0DD adds a sophisticated twist, while #E0FFFF provides a near-white, ethereal base, making this palette highly versatile for conveying charm and subtle vibrancy.

Best used for

  • Wedding stationery or event planning sites
  • Beauty and skincare product branding
  • Baby product e-commerce
  • Lifestyle and fashion blogs
  • Gentle mobile app interfaces
  • Dessert recipe websites

Suggested color roles

primary

A soft, inviting pink, ideal for main sections, headers, or gentle call-to-actions: #F8C4C4.

secondary

A warm, creamy peach perfect for backgrounds, secondary content blocks, or subtle accents: #FFDAB9.

accent

A delicate lilac that can be used for highlights, decorative elements, or interactive states: #DDA0DD.

background

A very light, almost white aqua that provides a clean, ethereal, and subtly cool base: #E0FFFF.

text

A dark charcoal (e.g., #333333) provides excellent readability against these light, sweet pastel shades.

Accessibility notes

  • Prioritize dark text (e.g., #333333) on all background colors from this palette for optimal contrast.
  • Avoid using light text on any of these pastels, as contrast will be insufficient.
  • Ensure interactive elements have clear visual cues beyond color, such as underlines or bolding for links.
  • Use #DDA0DD as an accent sparingly, and not for critical text due to its lightness.

Recommended combinations

Sweet & Serene

A balanced trio for main content, backgrounds, and gentle visual separation.

#F8C4C4 · #FFDAB9 · #B0E0E6

Elegant Pop

Use for subtle highlights, delicate illustrations, and a sophisticated touch on a light background.

#DDA0DD · #E0FFFF · #F8C4C4

Fresh Contrast

Great for creating a fresh, inviting feel in headers or introductory sections.

#B0E0E6 · #FFDAB9 · #F8C4C4

CSS variables

:root {
  --patisserie-macaron-assortment-3-1: #F8C4C4;
  --patisserie-macaron-assortment-3-2: #FFDAB9;
  --patisserie-macaron-assortment-3-3: #B0E0E6;
  --patisserie-macaron-assortment-3-4: #DDA0DD;
  --patisserie-macaron-assortment-3-5: #E0FFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "patisserie-macaron-assortment-3": {
        1: "#F8C4C4",
        2: "#FFDAB9",
        3: "#B0E0E6",
        4: "#DDA0DD",
        5: "#E0FFFF",
      }
    }
  }
}

Related searches

gentle pastel color palettesoft sweet UI colorsmacaron dessert themelight pink and blue schemeelegant pastel branding

Palette colors

Hex values

Color 1#F8C4C4
·
Color 2#FFDAB9
·
Color 3#B0E0E6
·
Color 4#DDA0DD
·
Color 5#E0FFFF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.1:1Fail
1.3:1Fail
1.5:1Fail
2
1.2:1Fail
1.1:1Fail
1.6:1Fail
1.2:1Fail
3
1.1:1Fail
1.1:1Fail
1.4:1Fail
1.4:1Fail
4
1.3:1Fail
1.6:1Fail
1.4:1Fail
2:1Fail
5
1.5:1Fail
1.2:1Fail
1.4:1Fail
2:1Fail

Similar palettes

More like Patisserie Macaron Assortment

View all pastel