Back to palettes

Palette

Sugared Spun Cloud

A deliciously sweet and light palette reminiscent of fluffy, spun cotton candy at a funfair.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sugared Spun Cloud 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 Sugared Spun Cloud.

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

Data visualization

#F4E2F9#F7C0F4#FFA8E9#FF89CC#FF66A0

Palette guide

How to use Sugared Spun Cloud

Overview

The Sugared Spun Cloud palette is a deliciously sweet and light collection, reminiscent of fluffy, spun cotton candy at a funfair, perfect for designs that demand a playful and vibrant touch. With hues ranging from the soft #F4E2F9 to the bold #FF66A0, and including #F7C0F4, #FFA8E9, and #FF89CC, this palette bursts with joyful energy. Designers can leverage these colors for cheerful children's brands, lively event promotions, or whimsical digital illustrations, creating an atmosphere of pure delight. For developers, these bright and inviting tones are excellent for crafting engaging user interfaces that feel both energetic and approachable, ensuring a memorable and fun user experience.

Best used for

  • Children's entertainment and branding
  • Candy store or dessert shop marketing
  • Playful event invitations and decorations
  • Youth-focused digital content
  • Feminine and fun fashion branding
  • Mobile gaming UI/UX

Suggested color roles

primary

#FFA8E9 serves as a vibrant, inviting core, embodying playfulness.

secondary

#F7C0F4 offers a softer, supportive pink, maintaining the sweet aesthetic.

accent

#FF66A0 provides a bold, energetic punch, ideal for calls-to-action or key highlights.

background

#F4E2F9 offers the lightest, airy base, perfect for a clean, sweet canvas.

text

#FF89CC can be used for larger headings, but a dark charcoal or black is recommended for body text on lighter backgrounds for optimal readability.

Accessibility notes

  • Many colors are light; a dark neutral text color (e.g., #333333) is essential for body copy on lighter backgrounds.
  • Ensure sufficient contrast when pairing text with backgrounds, especially for smaller font sizes and interactive elements.
  • The vibrant nature of #FF66A0 makes it suitable for strong calls-to-action, but check its contrast against adjacent colors.
  • Provide clear visual cues beyond color alone for interactive elements due to similar luminosities in the lighter hues.

Recommended combinations

Cotton Candy Dream

Creates soft, dreamy backgrounds or playful gradients for a whimsical feel.

#F4E2F9 · #F7C0F4 · #FFA8E9

Vibrant Pop

Ideal for eye-catching headings, buttons, or illustrations that demand attention.

#FFA8E9 · #FF89CC · #FF66A0

Sweet Contrast

Useful for establishing a clear visual hierarchy with a light base and vibrant accents.

#F4E2F9 · #FFA8E9 · #FF66A0

CSS variables

:root {
  --sugared-spun-cloud-1: #F4E2F9;
  --sugared-spun-cloud-2: #F7C0F4;
  --sugared-spun-cloud-3: #FFA8E9;
  --sugared-spun-cloud-4: #FF89CC;
  --sugared-spun-cloud-5: #FF66A0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sugared-spun-cloud": {
        1: "#F4E2F9",
        2: "#F7C0F4",
        3: "#FFA8E9",
        4: "#FF89CC",
        5: "#FF66A0",
      }
    }
  }
}

Related searches

pink cotton candy palettesweet playful colorsvibrant pastel schemefunfair aesthetic designsugary pink brand colors

Palette colors

Hex values

Color 1#F4E2F9
·
Color 2#F7C0F4
·
Color 3#FFA8E9
·
Color 4#FF89CC
·
Color 5#FF66A0
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.4:1Fail
1.8:1Fail
2.2:1Fail
2
1.2:1Fail
1.1:1Fail
1.4:1Fail
1.8:1Fail
3
1.4:1Fail
1.1:1Fail
1.2:1Fail
1.6:1Fail
4
1.8:1Fail
1.4:1Fail
1.2:1Fail
1.3:1Fail
5
2.2:1Fail
1.8:1Fail
1.6:1Fail
1.3:1Fail

Similar palettes

More like Sugared Spun Cloud

View all pastel