Palette

Pastel Rainbow Dream

A whimsical blend of gentle pastel hues, like a dream spun from candy clouds and soft light.

pastelplayful5 colors

More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FFD1DC#FFECB3#B3E0DC#D4B3FF#BFE8C2

Palette guide

How to use Pastel Rainbow Dream

Overview

The Pastel Rainbow Dream palette is a whimsical blend of gentle pastel hues, like a dream spun from candy clouds and soft light. This delightful collection features a sweet cherry blossom pink (#FFD1DC), a warm pale yellow (#FFECB3), a fresh minty teal (#B3E0DC), a soft lavender-purple (#D4B3FF), and a gentle sage green (#BFE8C2). Designers can leverage these harmonious hues to create playful, imaginative, and inviting visuals. Developers will find this palette excellent for crafting lighthearted user interfaces, children's applications, or branding that aims for a cheerful, approachable, and sophisticated aesthetic with a touch of magical wonder.

Best used for

Children's educational apps or websites
Creative stationery and craft supplies
Playful lifestyle branding
Whimsical event invitations (birthdays, baby showers)
Soft, inviting e-commerce platforms
Digital illustrations and animations

Suggested color roles

primary

#FFD1DC - A cheerful and inviting pink, ideal for prominent brand elements or a friendly call-to-action.

secondary

#B3E0DC - A fresh and calming minty teal, perfect for supporting sections, headers, or background accents.

accent

#D4B3FF - This soft lavender-purple adds a touch of magic, excellent for interactive elements or subtle highlights.

background

#FFECB3 - A warm pale yellow, providing a gentle, expansive canvas that enhances the dreamy, playful feel.

text

A deep charcoal or dark navy is highly recommended for optimal readability against these light, bright backgrounds.

Accessibility notes

Ensure sufficient contrast for text, as all palette colors are light and require a dark text color for legibility.
Avoid using very light text on colors like #FFECB3 or #BFE8C2; always prioritize dark text.
Use a color contrast checker to verify accessibility for all interactive elements and text on backgrounds.
For important information, consider using #FFD1DC or #B3E0DC as a background for better text legibility.

Recommended combinations

Candy Cloud

Ideal for sweet branding, playful illustrations, or whimsical social media content.

#FFD1DC · #FFECB3 · #D4B3FF

Minty Magic

Creates a fresh, enchanting atmosphere, suitable for nature-inspired children's products or calming interfaces.

#B3E0DC · #BFE8C2 · #FFD1DC

Dreamy Rainbow

Excellent for vibrant yet soft backgrounds, creative headers, or a joyful, imaginative visual presence.

#D4B3FF · #FFECB3 · #B3E0DC

CSS variables

:root {
  --pastel-rainbow-dream-1: #FFD1DC;
  --pastel-rainbow-dream-2: #FFECB3;
  --pastel-rainbow-dream-3: #B3E0DC;
  --pastel-rainbow-dream-4: #D4B3FF;
  --pastel-rainbow-dream-5: #BFE8C2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "pastel-rainbow-dream": {
        1: "#FFD1DC",
        2: "#FFECB3",
        3: "#B3E0DC",
        4: "#D4B3FF",
        5: "#BFE8C2",
      }
    }
  }
}

Hex values

Color 1#FFD1DC

Color 2#FFECB3

Color 3#B3E0DC

Color 4#D4B3FF

Color 5#BFE8C2

Accessibility

Contrast checker

1.2:1Fail

1.1:1Fail

1.3:1Fail

1:1Fail

1.2:1Fail

1.5:1Fail

1.2:1Fail

1.1:1Fail

1.2:1Fail

1.1:1Fail

1.3:1Fail

1.5:1Fail

1.2:1Fail

1.3:1Fail

1:1Fail

1.2:1Fail

1.1:1Fail

1.3:1Fail

Similar palettes

More like Pastel Rainbow Dream

Pastel Rainbow Dream

See it in context.

Ready when you are.

Built with Pastel Rainbow Dream.

How to use Pastel Rainbow Dream

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Candy Cloud

Minty Magic

Dreamy Rainbow

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Pastel Rainbow Dream