Back to palettes

Palette

Pastel Macaron

A delectable assortment of soft, sugary pastels, resembling a colorful array of gourmet macarons.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FBE2E7#F6DAEC#EEDCFB#E7EEFC#DDFEF7

Palette guide

How to use Pastel Macaron

Overview

The Pastel Macaron palette presents a delightful array of soft, sugary pastels, perfectly capturing the essence of a gourmet macaron assortment. This collection features a gentle rose pink (#FBE2E7), a soft lavender (#F6DAEC), a dreamy light violet (#EEDCFB), a serene baby blue (#E7EEFC), and a crisp mint green (#DDFEF7). Designers can leverage these delicate hues to create charming, ethereal, and inviting visuals. For developers, these colors are ideal for crafting light-themed user interfaces, children's product designs, or any digital presence aiming for a sweet, airy, and sophisticated aesthetic.

Best used for

  • Confectionery or sweet shop branding
  • Bridal or baby shower invitations
  • Fashion accessories for spring/summer
  • Children's clothing or toy design
  • Gentle, whimsical website interfaces
  • Lifestyle blogs and social media content

Suggested color roles

primary

#FBE2E7 - A soft, inviting pink, excellent for primary brand elements or a warm, welcoming background.

secondary

#E7EEFC - A calm and stable light blue, perfect for complementary sections, headers, or navigation.

accent

#F6DAEC - Use this delicate lavender for subtle calls-to-action, highlights, or decorative flourishes.

background

#DDFEF7 - A very light mint that provides a clean, airy canvas, making other colors pop gently.

text

Opt for a deep gray or charcoal to ensure optimal readability against these very light pastel tones.

Accessibility notes

  • Ensure sufficient contrast for text, as all palette colors are very light and require dark text.
  • Use a color contrast checker when pairing any two palette colors, especially for interactive elements.
  • Avoid using multiple light pastel colors for adjacent text and background; prioritize dark text.
  • Consider a slightly darker shade for borders or outlines to define elements clearly on light backgrounds.

Recommended combinations

Sugary Pink Dream

Ideal for feminine branding, sweet product packaging, or romantic design themes.

#FBE2E7 · #F6DAEC · #DDFEF7

Violet Sky

Creates a serene, dreamy atmosphere, suitable for calming interfaces or artistic illustrations.

#EEDCFB · #E7EEFC · #FBE2E7

Minty Fresh

Perfect for clean, airy designs, health and wellness branding, or refreshing digital content.

#DDFEF7 · #E7EEFC · #F6DAEC

CSS variables

:root {
  --pastel-macaron-1: #FBE2E7;
  --pastel-macaron-2: #F6DAEC;
  --pastel-macaron-3: #EEDCFB;
  --pastel-macaron-4: #E7EEFC;
  --pastel-macaron-5: #DDFEF7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "pastel-macaron": {
        1: "#FBE2E7",
        2: "#F6DAEC",
        3: "#EEDCFB",
        4: "#E7EEFC",
        5: "#DDFEF7",
      }
    }
  }
}

Related searches

pastel sweet color schemedelicate dessert colorslight playful UI paletteairy macaron huessoft whimsical design

Palette colors

Hex values

Color 1#FBE2E7
·
Color 2#F6DAEC
·
Color 3#EEDCFB
·
Color 4#E7EEFC
·
Color 5#DDFEF7
·

Accessibility

Contrast checker

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

Similar palettes

More like Pastel Macaron

View all pastel
Macaron Sweet Delight
Pastel Confection Swirl
Sweet Macaron Tower
Buttercream Frosting Soft
Lemon Meringue Dream
Macaron Cloud Dream