Palette

Cotton Candy Skies

Soft, ethereal hues of a dawn sky, reminiscent of sugary confections and whimsical cloud formations.

pastelplayful5 colors

More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cotton Candy Skies 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 Cotton Candy Skies.

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

Data visualization

#FDDCE0#BFE8F6#E7D0ED#FDEBCE#F8F8F8

Palette guide

How to use Cotton Candy Skies

Overview

The 'Cotton Candy Skies' palette offers a soft, ethereal collection of hues inspired by a serene dawn sky and sugary confections. Featuring a delicate rose pink (#FDDCE0), a calming sky blue (#BFE8F6), a gentle lavender (#E7D0ED), a creamy peach (#FDEBCE), and a crisp off-white (#F8F8F8), this palette is ideal for creating light, dreamy, and playful experiences. Designers and developers can utilize these versatile pastels to evoke a sense of calm and whimsy in digital interfaces, branding, or print materials, ensuring a fresh and inviting visual appeal for users.

Best used for

Bridal or baby shower branding
Beauty and skincare product packaging
Lighthearted digital illustrations
Spring/summer marketing campaigns
Children's book designs
Zen or meditation app interfaces

Suggested color roles

primary

#FDDCE0 (Rose Pink) - Use as a soft, inviting main color for headers or prominent graphic elements.

secondary

#BFE8F6 (Sky Blue) - Provides a calming contrast, ideal for secondary content blocks or background accents.

accent

#E7D0ED (Lavender) - A subtle, sophisticated accent for interactive elements, icons, or decorative details.

background

#F8F8F8 (Off-White) - An airy and clean base that allows other colors to shine, perfect for main content areas.

text

#FDEBCE (Creamy Peach) - Best for decorative, large text. For body text, use a dark grey or black (#333333) on lighter backgrounds for legibility.

Accessibility notes

Ensure sufficient contrast for text, especially when using lighter shades like #FDEBCE and #F8F8F8 together.
For body text, use a dark neutral color (e.g., #444444) against #F8F8F8 or #FDEBCE backgrounds.
The pastel nature of this palette means some combinations may fail WCAG AA for small text, so test carefully.
Reserve #FDDCE0 and #BFE8F6 for larger headings or graphical elements to maximize visual impact without readability issues.

Recommended combinations

Sky Dream

Perfect for serene website headers, social media graphics, or soft branding.

#FDDCE0 · #BFE8F6 · #F8F8F8

Whimsical Dawn

Excellent for delicate illustrations, event invitations, or packaging that needs a sweet touch.

#E7D0ED · #FDEBCE · #FDDCE0

Airy Base

Provides a clean, open feel for app interfaces, content cards, or minimalist designs.

#F8F8F8 · #BFE8F6 · #E7D0ED

CSS variables

:root {
  --cotton-candy-skies-1: #FDDCE0;
  --cotton-candy-skies-2: #BFE8F6;
  --cotton-candy-skies-3: #E7D0ED;
  --cotton-candy-skies-4: #FDEBCE;
  --cotton-candy-skies-5: #F8F8F8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cotton-candy-skies": {
        1: "#FDDCE0",
        2: "#BFE8F6",
        3: "#E7D0ED",
        4: "#FDEBCE",
        5: "#F8F8F8",
      }
    }
  }
}

Hex values

Color 1#FDDCE0

Color 2#BFE8F6

Color 3#E7D0ED

Color 4#FDEBCE

Color 5#F8F8F8

Accessibility

Contrast checker

1:1Fail

1.1:1Fail

1.2:1Fail

1:1Fail

1.1:1Fail

1.2:1Fail

1.1:1Fail

1.2:1Fail

1.4:1Fail

1.1:1Fail

1.2:1Fail

1.1:1Fail

1.2:1Fail

1.4:1Fail

1.1:1Fail

Similar palettes

More like Cotton Candy Skies

Cotton Candy Skies

See it in context.

Ready when you are.

Built with Cotton Candy Skies.

How to use Cotton Candy Skies

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Sky Dream

Whimsical Dawn

Airy Base

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Cotton Candy Skies