Back to palettes

Palette

Pastel Cloud Dream

Soft, ethereal shades reminiscent of a fantastical sky filled with cotton candy clouds at sunset.

pastelcalm5 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

#B0E0E6#ADD8E6#DDA0DD#FFC0CB#F0F8FF

Palette guide

How to use Pastel Cloud Dream

Overview

The Pastel Cloud Dream palette (version 2) offers a serene and ethereal blend of soft blues and gentle pinks, perfect for evoking calm and whimsy. This collection features calming PowderBlue (#B0E0E6), expansive LightBlue (#ADD8E6), dreamy Plum (#DDA0DD), and sweet Pink (#FFC0CB), all grounded by the airy AliceBlue (#F0F8FF). It's designed to create a fantastical sky filled with cotton candy clouds, making it ideal for projects that require a delicate, soothing, or romantic atmosphere. Designers and developers can leverage these hues to build inviting interfaces, create soft brand identities, or illustrate dreamlike scenes, ensuring a gentle user experience.

Best used for

  • Meditation and wellness app interfaces
  • Nursery decor and baby product branding
  • Fantasy art and delicate digital illustrations
  • Serene website layouts for creative businesses
  • Gentle branding for lifestyle or beauty products
  • Romantic event invitations and themes

Suggested color roles

primary

Use PowderBlue (#B0E0E6) as a calming, expansive primary color for backgrounds or large content blocks, reflecting peace.

secondary

Plum (#DDA0DD) provides a soft, dreamy counterpoint, excellent for secondary headings, subtle borders, or decorative elements.

accent

Pink (#FFC0CB) introduces a touch of warmth and playfulness, perfect for calls-to-action, highlights, or small interactive elements.

background

AliceBlue (#F0F8FF) offers an exceptionally light and airy canvas, ensuring content feels open and uncluttered.

text

A dark gray or deep blue (e.g., #333366) will provide essential contrast for body text, ensuring legibility against the light palette.

Accessibility notes

  • Text contrast is critical; always use dark, highly legible text colors over these light backgrounds.
  • Ensure interactive elements have clear visual states, as the subtle palette may make changes less obvious.
  • Avoid using the lighter palette colors for small font sizes or crucial information to maintain readability.
  • Consider providing alternative text representations or larger hit areas for elements relying solely on color distinction.

Recommended combinations

Misty Morning

Ideal for serene gradients or layered backgrounds that evoke a calm, expansive sky.

#B0E0E6 · #ADD8E6 · #F0F8FF

Sunset Haze

Combine for gentle accents, decorative elements, or soft illustrations depicting a dreamy twilight.

#DDA0DD · #FFC0CB · #F0F8FF

Ethereal Blend

Create flowing, soft designs for headers or graphical elements where a harmonious transition is desired.

#ADD8E6 · #DDA0DD · #B0E0E6

CSS variables

:root {
  --pastel-cloud-dream-2-1: #B0E0E6;
  --pastel-cloud-dream-2-2: #ADD8E6;
  --pastel-cloud-dream-2-3: #DDA0DD;
  --pastel-cloud-dream-2-4: #FFC0CB;
  --pastel-cloud-dream-2-5: #F0F8FF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "pastel-cloud-dream-2": {
        1: "#B0E0E6",
        2: "#ADD8E6",
        3: "#DDA0DD",
        4: "#FFC0CB",
        5: "#F0F8FF",
      }
    }
  }
}

Related searches

dreamy pastel palettecalm color schemeethereal ui colorssoft blue pinkserene branding

Palette colors

Hex values

Color 1#B0E0E6
·
Color 2#ADD8E6
·
Color 3#DDA0DD
·
Color 4#FFC0CB
·
Color 5#F0F8FF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.4:1Fail
1.1:1Fail
1.3:1Fail
2
1.1:1Fail
1.4:1Fail
1:1Fail
1.4:1Fail
3
1.4:1Fail
1.4:1Fail
1.3:1Fail
1.9:1Fail
4
1.1:1Fail
1:1Fail
1.3:1Fail
1.4:1Fail
5
1.3:1Fail
1.4:1Fail
1.9:1Fail
1.4:1Fail

Similar palettes

More like Pastel Cloud Dream

View all pastel
Cloud Blossom Breeze
Cloud Dream Whisper
Cloud Whispers
Cloudscape Dreamy Soft
Cosmic Cloud Drift
Dreamy Cotton