Back to palettes

Palette

Pastel Cloud Dream

Whispers of gentle pinks, greens, and blues creating a serene and ethereal dreamscape.

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

#FFD1DC#FFABAB#BFFCC6#A7D9FD#D9D9FF

Palette guide

How to use Pastel Cloud Dream

Overview

The Pastel Cloud Dream palette (version 4) weaves whispers of gentle pinks, greens, and blues into a serene and ethereal dreamscape. This collection features soft LightPink (#FFD1DC), delicate LightCoral (#FFABAB), fresh minty green (#BFFCC6), airy light sky blue (#A7D9FD), and a calming lavender-blue (#D9D9FF). It's designed to create a peaceful and light atmosphere, making it perfect for projects that require a sense of tranquility, softness, or understated beauty. Designers and developers can leverage these harmonious hues to craft soothing user experiences, elegant brand identities, or delicate visual content that feels both gentle and sophisticated.

Best used for

  • Baby shower themes and announcements
  • Peaceful bedroom decor and textile designs
  • Romantic brand identities for boutique shops
  • Wellness and mindfulness app interfaces
  • Delicate stationery and greeting cards
  • Art installations and abstract digital art

Suggested color roles

primary

Use LightPink (#FFD1DC) as a soft, welcoming base for main sections or prominent UI elements, establishing a gentle presence.

secondary

Light sky blue (#A7D9FD) provides a cool, airy balance, excellent for secondary backgrounds, headers, or informational panels.

accent

Minty green (#BFFCC6) introduces a fresh, subtle pop, ideal for icons, interactive elements, or small decorative details.

background

Lavender-blue (#D9D9FF) offers a calming, understated backdrop that supports content without overpowering the overall softness.

text

A dark gray or a subdued navy (e.g., #36454F) will provide essential clarity for body text, ensuring legibility against the light palette.

Accessibility notes

  • Due to the low saturation, contrast can be challenging; prioritize dark, legible text on all backgrounds.
  • Avoid using these light colors for small text or critical UI elements where clear legibility is non-negotiable.
  • Ensure interactive elements have clear visual feedback for states like hover or focus, perhaps by using a darker outline.
  • When using these colors for gradients or overlays, ensure any superimposed text or icons maintain sufficient contrast.

Recommended combinations

Gentle Blush

Perfect for soft, romantic accents, subtle gradients, or decorative elements that evoke warmth and tenderness.

#FFD1DC · #FFABAB · #D9D9FF

Sky Garden

Great for creating fresh, open, or nature-inspired layouts, maintaining an airy and tranquil mood.

#A7D9FD · #BFFCC6 · #D9D9FF

Dreamy Layers

Combine for layered graphical elements, soft illustrations, or UI components needing subtle depth and harmony.

#FFD1DC · #A7D9FD · #BFFCC6

CSS variables

:root {
  --pastel-cloud-dream-4-1: #FFD1DC;
  --pastel-cloud-dream-4-2: #FFABAB;
  --pastel-cloud-dream-4-3: #BFFCC6;
  --pastel-cloud-dream-4-4: #A7D9FD;
  --pastel-cloud-dream-4-5: #D9D9FF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "pastel-cloud-dream-4": {
        1: "#FFD1DC",
        2: "#FFABAB",
        3: "#BFFCC6",
        4: "#A7D9FD",
        5: "#D9D9FF",
      }
    }
  }
}

Related searches

serene pastel palettesoft pink blue greenethereal branding colorscalm ui designbaby room colors

Palette colors

Hex values

Color 1#FFD1DC
·
Color 2#FFABAB
·
Color 3#BFFCC6
·
Color 4#A7D9FD
·
Color 5#D9D9FF
·

Accessibility

Contrast checker

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

Similar palettes

More like Pastel Cloud Dream

View all pastel
Ethereal Dreamscape
Spring Sky Bloom
Lavender Fields Dream
Meadow Spring Fresh
Misty Morning Dew
Pastel Blossom Dream