Back to palettes

Palette

Pastel Cloud Dream

A soft, whimsical collection inspired by the gentle, fading colors of a pastel dreamscape.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#D9D2E9#C1E1DE#FDF7D8#F7C6D2#A8D1E6

Palette guide

How to use Pastel Cloud Dream

Overview

The Pastel Cloud Dream palette (version 5) is a soft, whimsical collection inspired by the gentle, fading colors of a dreamscape. It features muted lavender (#D9D2E9), refreshing light teal (#C1E1DE), creamy yellow (#FDF7D8), inviting light pink (#F7C6D2), and airy sky blue (#A8D1E6). This palette offers a sophisticated yet playful feel, making it versatile for projects that aim for a gentle, dreamy, and approachable aesthetic. Designers and developers can leverage these harmonious hues to craft engaging user experiences, elegant brand identities, or charming visual content that feels both lighthearted and refined.

Best used for

  • Lifestyle blogs and online magazines
  • Artisan crafts and handmade product branding
  • Delicate e-commerce sites for gifts or apparel
  • Personal branding and creative portfolios
  • Calm digital illustrations and animations
  • Nursery themes and children's room decor

Suggested color roles

primary

Utilize muted lavender (#D9D2E9) as a sophisticated and gentle foundation for main sections or prominent features.

secondary

Light teal (#C1E1DE) adds a refreshing, clean note, excellent for secondary backgrounds, headers, or informational panels.

accent

Light pink (#F7C6D2) provides a warm, inviting touch, perfect for calls-to-action, highlights, or small decorative details.

background

Creamy yellow (#FDF7D8) serves as a soft, warm, and inviting canvas, enhancing the palette's gentle glow.

text

A dark gray or a deep plum (e.g., #5D4037) will ensure clear readability for body text while maintaining the palette's elegant and soft character.

Accessibility notes

  • Ensure sufficient contrast for all text elements, as many palette colors are light; dark text is crucial for readability.
  • Avoid using very light colors for small text or critical UI elements to prevent readability issues, especially for forms.
  • When layering colors, test contrast ratios for both foreground and background elements to meet WCAG standards.
  • Consider using larger font sizes for decorative headings or quotes if they must be rendered in one of the lighter palette colors.

Recommended combinations

Gentle Horizon

Ideal for creating serene, expansive layouts or backgrounds that evoke a calm, open sky or landscape.

#A8D1E6 · #C1E1DE · #D9D2E9

Sunset Glow

Combine for warm, soft accents, decorative elements, or illustrations depicting a gentle, fading light.

#F7C6D2 · #FDF7D8 · #D9D2E9

Ethereal Blend

Use for harmonious, layered designs, subtle gradients, or graphical elements that need a soft, cohesive look.

#C1E1DE · #FDF7D8 · #A8D1E6

CSS variables

:root {
  --pastel-cloud-dream-5-1: #D9D2E9;
  --pastel-cloud-dream-5-2: #C1E1DE;
  --pastel-cloud-dream-5-3: #FDF7D8;
  --pastel-cloud-dream-5-4: #F7C6D2;
  --pastel-cloud-dream-5-5: #A8D1E6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "pastel-cloud-dream-5": {
        1: "#D9D2E9",
        2: "#C1E1DE",
        3: "#FDF7D8",
        4: "#F7C6D2",
        5: "#A8D1E6",
      }
    }
  }
}

Related searches

whimsical pastel palettesoft muted colorsgentle web designlight blue pink purpleartisan brand colors

Palette colors

Hex values

Color 1#D9D2E9
·
Color 2#C1E1DE
·
Color 3#FDF7D8
·
Color 4#F7C6D2
·
Color 5#A8D1E6
·

Accessibility

Contrast checker

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

Similar palettes

More like Pastel Cloud Dream

View all pastel
Cotton Candy Dream
Cotton Candy Hues
Ethereal Bloom Fae
Fairy Blossom Whisper
Pastel Cloud Dream
Pastel Cloud Kingdom