Back to palettes

Palette

Macaron Sweet Dream

A delightful medley of soft, sweet pastels, inspired by the colorful and delicate French macarons.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FFF0F5#FFDAB9#E6E6FA#ADD8E6#F0FFF0

Palette guide

How to use Macaron Sweet Dream

Overview

The 'Macaron Sweet Dream' palette delivers a delightful medley of soft, sweet pastels, inspired by the colorful and delicate French macarons. It features a gentle blush pink (#FFF0F5), a warm peach (#FFDAB9), a calming lavender (#E6E6FA), a serene light blue (#ADD8E6), and a refreshing minty off-white (#F0FFF0). This collection is perfect for designers and developers aiming to create ethereal, playful, and inviting interfaces or branding. The harmonious blend of these light hues ensures a feeling of tranquility and elegant simplicity, ideal for soft, approachable projects.

Best used for

  • Wedding and event stationery design
  • Baby clothing and nursery decor brands
  • Feminine beauty and lifestyle blogs
  • Children's book illustrations
  • Spa and wellness promotional materials
  • Online boutiques for handmade goods

Suggested color roles

primary

Use #FFF0F5 as a delicate primary background or a soft base for branding, offering a clean, airy feel.

secondary

Incorporate #E6E6FA for complementary sections, providing a calming and sophisticated secondary tone.

accent

Highlight with #ADD8E6 for subtle calls-to-action, active states, or decorative elements, adding a touch of serenity.

background

Utilize #F0FFF0 as a pristine, neutral background color, ensuring excellent readability for darker text.

text

For clear and accessible text, use a deep charcoal like #333333 against any of these light background colors.

Accessibility notes

  • Ensure all text has high contrast; a dark charcoal or black is recommended for readability on these light backgrounds.
  • Avoid using two light pastels from the palette for adjacent interactive elements without sufficient visual separation.
  • Verify that clickable elements like buttons or links have clear focus states with distinct contrast.
  • When layering colors, ensure the foreground elements have at least a 3:1 contrast ratio with their immediate background.

Recommended combinations

Dreamy Base

Excellent for creating soft, layered backgrounds or multi-section layouts in web design.

#FFF0F5 · #E6E6FA · #F0FFF0

Sweet Highlights

Perfect for subtle interactive elements, icons, or to delineate different content blocks.

#FFDAB9 · #ADD8E6 · #E6E6FA

Gentle Branding

A warm and inviting combination suitable for brand logos, headers, and primary UI colors.

#FFF0F5 · #FFDAB9 · #F0FFF0

CSS variables

:root {
  --macaron-sweet-dream-1: #FFF0F5;
  --macaron-sweet-dream-2: #FFDAB9;
  --macaron-sweet-dream-3: #E6E6FA;
  --macaron-sweet-dream-4: #ADD8E6;
  --macaron-sweet-dream-5: #F0FFF0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "macaron-sweet-dream": {
        1: "#FFF0F5",
        2: "#FFDAB9",
        3: "#E6E6FA",
        4: "#ADD8E6",
        5: "#F0FFF0",
      }
    }
  }
}

Related searches

sweet pastel schemesmacaron inspired colorssoft dream palettelight playful brandingethereal color combinations

Palette colors

Hex values

Color 1#FFF0F5
·
Color 2#FFDAB9
·
Color 3#E6E6FA
·
Color 4#ADD8E6
·
Color 5#F0FFF0
·

Accessibility

Contrast checker

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

Similar palettes

More like Macaron Sweet Dream

View all pastel