Back to palettes

Palette

Macaron Cloud Dream

An airy, delicate collection of pale pastels, like a tray of freshly baked macarons.

Pastelcalm5 colors
More Pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#F8F2E2#FCEEEB#EEDFE8#D8EBF3#F6E6E8

Palette guide

How to use Macaron Cloud Dream

Overview

The Macaron Cloud Dream palette is an airy and delicate collection of pale pastels, evoking a sense of calm and sweetness. Featuring gentle hues like #F8F2E2 (Cream), #FCEEEB (Blush Pink), #EEDFE8 (Soft Lavender-Pink), #D8EBF3 (Pale Sky Blue), and #F6E6E8 (Light Rose), this palette is designed for designers and developers seeking to create soft, ethereal, and inviting experiences. It's ideal for projects that require a light touch, conveying elegance, comfort, and a dreamy aesthetic, perfect for sensitive or luxurious branding.

Best used for

  • Baby product branding and packaging
  • Wedding stationery and event design
  • Luxury beauty and cosmetic brands
  • Patisserie and dessert shop branding
  • Spa and wellness center aesthetics
  • Delicate fashion and textile designs

Suggested color roles

primary

Use #F8F2E2 as a soft, foundational background color, providing a clean and warm base for content.

secondary

Employ #FCEEEB or #F6E6E8 for subtle accents, borders, or secondary content blocks to add gentle warmth.

accent

Introduce #D8EBF3 or #EEDFE8 for delicate highlights, decorative illustrations, or hover states, offering a cool, dreamy touch.

background

Any of the lighter shades like #F8F2E2 or #FCEEEB can serve as a primary background to maintain the airy feel.

text

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

Accessibility notes

  • Crucially, ensure all text has sufficient contrast against these very light background colors; use dark text only.
  • Avoid using any of the palette colors for small body text as they will likely fail WCAG contrast guidelines.
  • For interactive elements, ensure they are distinguishable not just by color, but also by size or other visual cues.
  • Consider using larger font sizes for headings or key information if a lighter text color from the palette is used (though not recommended).

Recommended combinations

Gentle Air

Creates an extremely light and ethereal feel, suitable for delicate backgrounds or subtle branding.

#F8F2E2 · #FCEEEB · #D8EBF3

Blush Dream

Ideal for romantic or sweet themes, offering a soft, inviting warmth.

#EEDFE8 · #F6E6E8 · #F8F2E2

Sky & Bloom

Combines cool and warm pastels for a balanced, dreamy aesthetic in illustrations or gentle interfaces.

#D8EBF3 · #F6E6E8 · #FCEEEB

CSS variables

:root {
  --macaron-cloud-dream-2-1: #F8F2E2;
  --macaron-cloud-dream-2-2: #FCEEEB;
  --macaron-cloud-dream-2-3: #EEDFE8;
  --macaron-cloud-dream-2-4: #D8EBF3;
  --macaron-cloud-dream-2-5: #F6E6E8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "macaron-cloud-dream-2": {
        1: "#F8F2E2",
        2: "#FCEEEB",
        3: "#EEDFE8",
        4: "#D8EBF3",
        5: "#F6E6E8",
      }
    }
  }
}

Related searches

pastel cloud palettesoft macaron colorsdelicate dreamy hueslight ethereal designsubtle sweet palette

Palette colors

Hex values

Color 1#F8F2E2
·
Color 2#FCEEEB
·
Color 3#EEDFE8
·
Color 4#D8EBF3
·
Color 5#F6E6E8
·

Accessibility

Contrast checker

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

Similar palettes

More like Macaron Cloud Dream

View all Pastel