Back to palettes

Palette

Cotton Candy Dream

Whimsical and soft, like fluffy clouds of spun sugar at a cheerful fairground.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#F2BDD7#E4EFEF#FDE6F1#BFD7EA#DDCBF4

Palette guide

How to use Cotton Candy Dream

Overview

The Cotton Candy Dream palette is whimsical and soft, like fluffy clouds of spun sugar at a cheerful fairground. It features gentle pinks like #F2BDD7 and #FDE6F1, alongside refreshing blues like #E4EFEF and #BFD7EA. A delicate #DDCBF4 (Lavender Gray) completes this dreamy spectrum. This palette is ideal for designs that aim for a sweet, innocent, and playful feel, perfect for children's brands, romantic aesthetics, or any project requiring a touch of lighthearted charm and ethereal beauty.

Best used for

  • Children's product branding and packaging
  • Sweet shop or dessert branding
  • Wedding and baby shower invitations
  • Playful website design for young audiences
  • Dreamy digital art and illustrations
  • Soft and whimsical social media content

Suggested color roles

primary

Use #E4EFEF or #FDE6F1 as a soft, ethereal background, creating an open and inviting space.

secondary

Apply #F2BDD7 or #BFD7EA for distinct sections, headers, or subtle patterned elements.

accent

Utilize #DDCBF4 for delicate highlights, small icons, or a subtle glow on interactive components.

background

The lightest hues #E4EFEF and #FDE6F1 are excellent for creating airy, gentle backdrops.

text

For primary text, use a dark charcoal or medium gray. Avoid using light pastels for body text.

Accessibility notes

  • Ensure sufficient contrast between dark text (charcoal, medium gray) and all light pastel backgrounds.
  • Avoid using any of the palette's colors for text on other light colors; they will fail contrast checks for readability.
  • Use these colors primarily for backgrounds, illustrations, and non-textual elements.
  • When using for critical information, pair with a highly contrasting dark text color like black or #333333.

Recommended combinations

Fairground Sky

Creates a serene, layered sky effect, perfect for backgrounds or subtle visual transitions.

#E4EFEF · #BFD7EA · #F2BDD7

Spun Sugar

Ideal for delicate elements, blending soft pinks and lavender for a gentle, whimsical feel.

#F2BDD7 · #FDE6F1 · #DDCBF4

Sweet Clouds

Combines a soft blue, pink, and near-white for playful yet gentle patterns or section dividers.

#BFD7EA · #F2BDD7 · #E4EFEF

CSS variables

:root {
  --cotton-candy-dream-3-1: #F2BDD7;
  --cotton-candy-dream-3-2: #E4EFEF;
  --cotton-candy-dream-3-3: #FDE6F1;
  --cotton-candy-dream-3-4: #BFD7EA;
  --cotton-candy-dream-3-5: #DDCBF4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cotton-candy-dream-3": {
        1: "#F2BDD7",
        2: "#E4EFEF",
        3: "#FDE6F1",
        4: "#BFD7EA",
        5: "#DDCBF4",
      }
    }
  }
}

Related searches

pastel pink blue purple palettecotton candy aesthetic colorsdreamy soft color schemewhimsical light brandingfairground theme colors

Palette colors

Hex values

Color 1#F2BDD7
·
Color 2#E4EFEF
·
Color 3#FDE6F1
·
Color 4#BFD7EA
·
Color 5#DDCBF4
·

Accessibility

Contrast checker

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

Similar palettes

More like Cotton Candy Dream

View all pastel
Cotton Candy Sunset
Bubblegum Dream Pop
Candy Cloud
Confection Cloud Blush
Cotton Candy Clouds
Cotton Candy Dream