Back to palettes

Palette

Cotton Candy Swirl

Sugary sweet pastels swirling together like a delicate and playful cotton candy confection.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FDF4F6#F2D0E0#E7B0CC#DC90B8#D170A4

Palette guide

How to use Cotton Candy Swirl

Overview

The 'Cotton Candy Swirl' palette presents a delightful gradient of sugary sweet pastels, swirling together like a delicate and playful confection. Featuring a very light pink (#FDF4F6), a soft rose (#F2D0E0), a medium pink (#E7B0CC), a deeper rose (#DC90B8), and a rich, vibrant pink (#D170A4), this monochromatic palette is perfect for designers and developers seeking to convey sweetness, tenderness, and charm. Its range of pinks allows for depth and variation while maintaining a cohesive, inviting, and distinctly feminine or youthful aesthetic across various digital and print applications.

Best used for

  • Beauty and cosmetic product lines
  • Children's fashion and accessories
  • Valentine's Day themed promotions
  • Feminine brand identities
  • Dessert and confectionery packaging
  • Wedding and event stationery

Suggested color roles

primary

#D170A4 (Rich Pink) - A vibrant, impactful primary color for bold statements, call-to-actions, or main graphical elements.

secondary

#E7B0CC (Medium Pink) - Provides a softer complementary tone, ideal for subheadings, secondary sections, or detailed graphics.

accent

#DC90B8 (Deeper Rose) - Use for subtle accents, interactive states, or to add depth within the pink spectrum.

background

#FDF4F6 (Very Light Pink) - An airy, clean background that offers a gentle and inviting canvas for content.

text

#F2D0E0 (Soft Rose) - Best for decorative, large text. For body text, use a dark neutral like charcoal (#333333) or a deep plum against lighter backgrounds for readability.

Accessibility notes

  • When using multiple light pinks, ensure sufficient contrast for text, especially for small font sizes.
  • Avoid pairing #FDF4F6 with #F2D0E0 for text, as the contrast will be insufficient for readability.
  • For critical text, use a dark, contrasting color (e.g., #222222) against #FDF4F6 or #F2D0E0 backgrounds.
  • Consider using #D170A4 or #DC90B8 for headings and important elements to improve visibility.

Recommended combinations

Pink Gradient

Ideal for creating smooth transitions, layered designs, or visually appealing web sections.

#FDF4F6 · #E7B0CC · #D170A4

Sweet Accents

Great for feminine branding, highlight elements, or playful illustrations.

#F2D0E0 · #DC90B8 · #D170A4

Soft Contrast

Perfect for elegant packaging, delicate UI components, or romantic digital content.

#FDF4F6 · #D170A4 · #DC90B8

CSS variables

:root {
  --cotton-candy-swirl-1: #FDF4F6;
  --cotton-candy-swirl-2: #F2D0E0;
  --cotton-candy-swirl-3: #E7B0CC;
  --cotton-candy-swirl-4: #DC90B8;
  --cotton-candy-swirl-5: #D170A4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cotton-candy-swirl": {
        1: "#FDF4F6",
        2: "#F2D0E0",
        3: "#E7B0CC",
        4: "#DC90B8",
        5: "#D170A4",
      }
    }
  }
}

Related searches

monochromatic pink palettesweet pastel colorsfeminine design schemecandy inspired huespink gradient aesthetic

Palette colors

Hex values

Color 1#FDF4F6
·
Color 2#F2D0E0
·
Color 3#E7B0CC
·
Color 4#DC90B8
·
Color 5#D170A4
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.7:1Fail
2.2:1Fail
3:1Fail
2
1.3:1Fail
1.3:1Fail
1.7:1Fail
2.3:1Fail
3
1.7:1Fail
1.3:1Fail
1.3:1Fail
1.7:1Fail
4
2.2:1Fail
1.7:1Fail
1.3:1Fail
1.3:1Fail
5
3:1Fail
2.3:1Fail
1.7:1Fail
1.3:1Fail

Similar palettes

More like Cotton Candy Swirl

View all pastel
Candy Cloud Dream
Candy Floss Cloud
Bubblegum Carnival Pop
Bubblegum Pop Sky
Candy Floss Cloud
Candy Floss Clouds