Back to palettes

Palette

Macaron Dream Treat

A whimsical array of tender pastel hues, as light and airy as a French macaron assortment.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Macaron Dream Treat 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 Macaron Dream Treat.

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

Data visualization

#F7E0E8#E2F0D9#D9EBF0#F0E8D9#F5DDE7

Palette guide

How to use Macaron Dream Treat

Overview

The Macaron Dream Treat palette is a whimsical array of tender pastel hues, as light and airy as a French macaron assortment. It features #F7E0E8 (Light Pink), #E2F0D9 (Pale Green), #D9EBF0 (Soft Blue), #F0E8D9 (Creamy Yellow), and #F5DDE7 (Muted Lavender). This collection is perfect for designers and developers aiming to create soft, inviting, and playful digital or physical experiences. It conveys a sense of delicacy, charm, and understated sweetness, making it highly suitable for luxury confections, gentle branding, or children's themes.

Best used for

  • Patisserie and confectionery branding
  • Children's book illustrations
  • Wedding favor packaging
  • Soft home decor and textile designs
  • Beauty and skincare product lines
  • Lifestyle and craft blogs

Suggested color roles

primary

Utilize #F0E8D9 as a warm, neutral base for backgrounds or main content areas, providing a sense of calm.

secondary

Employ #F7E0E8 or #E2F0D9 for subtle accents, headers, or secondary information, adding gentle color.

accent

Introduce #D9EBF0 or #F5DDE7 for delicate highlights, decorative elements, or interactive states, offering a charming pop.

background

Any of the light shades like #F0E8D9 or #D9EBF0 can serve as a primary background, maintaining the palette's airy feel.

text

For body text, a dark gray or charcoal is essential for readability. Avoid using any of the palette colors for small text due to low contrast.

Accessibility notes

  • All colors in this palette are very light; strong contrast for text is crucial. Always use dark text (e.g., black or dark gray).
  • Avoid using any of these pastel colors for small body text as they will not meet WCAG contrast guidelines.
  • Ensure interactive elements are clearly distinguishable through means other than just color (e.g., size, underline, icon).
  • If a lighter color must be used for text, ensure it's for very large headings or decorative text where readability is less critical.

Recommended combinations

Delicate Harmony

Creates a soft, balanced and inviting feel, ideal for elegant and understated designs.

#F7E0E8 · #E2F0D9 · #F0E8D9

Cloud Whispers

Perfect for ethereal and dreamy themes, offering a cool and gentle blend of hues.

#D9EBF0 · #F5DDE7 · #E2F0D9

Soft Confection

Evokes a sweet and tender mood, excellent for confectionery branding or charming illustrations.

#F0E8D9 · #F7E0E8 · #D9EBF0

CSS variables

:root {
  --macaron-dream-treat-1: #F7E0E8;
  --macaron-dream-treat-2: #E2F0D9;
  --macaron-dream-treat-3: #D9EBF0;
  --macaron-dream-treat-4: #F0E8D9;
  --macaron-dream-treat-5: #F5DDE7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "macaron-dream-treat": {
        1: "#F7E0E8",
        2: "#E2F0D9",
        3: "#D9EBF0",
        4: "#F0E8D9",
        5: "#F5DDE7",
      }
    }
  }
}

Related searches

pastel dessert palettesoft macaron colorsdreamy confection hueslight whimsical designsubtle sweet branding

Palette colors

Hex values

Color 1#F7E0E8
·
Color 2#E2F0D9
·
Color 3#D9EBF0
·
Color 4#F0E8D9
·
Color 5#F5DDE7
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1:1Fail
1:1Fail
1:1Fail
2
1.1:1Fail
1:1Fail
1:1Fail
1.1:1Fail
3
1:1Fail
1:1Fail
1:1Fail
1:1Fail
4
1:1Fail
1:1Fail
1:1Fail
1.1:1Fail
5
1:1Fail
1.1:1Fail
1:1Fail
1.1:1Fail

Similar palettes

More like Macaron Dream Treat

View all pastel