Back to palettes

Palette

Fluffy Cloud Treat

Dreamy gradients of pink and purple, swirling like sugary clouds in a whimsical sky.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Fluffy Cloud Treat 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 Fluffy Cloud Treat.

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

Data visualization

#FBE4F4#F8BFEF#F199E8#E67EE1#DB5FD8

Palette guide

How to use Fluffy Cloud Treat

Overview

The 'Fluffy Cloud Treat' palette offers dreamy gradients of pink and purple, swirling like sugary clouds in a whimsical sky. This collection, featuring the delicate #FBE4F4, the soft #F8BFEF, and the vibrant #F199E8, is designed for playful and sweet aesthetics. The deeper tones of #E67EE1 and #DB5FD8 provide a rich, enchanting depth, ensuring versatility across various design elements. Designers and developers can utilize this palette to create delightful digital interfaces, charming branding, or enchanting illustrations that aim to evoke a sense of fantasy, softness, and irresistible sweetness, ensuring a memorable and visually appealing experience.

Best used for

  • Children's product branding
  • Candy and dessert shop websites
  • Feminine lifestyle and beauty blogs
  • Whimsical illustration and art
  • Baby shower invitations and decor
  • Mobile game interfaces (casual/cute)

Suggested color roles

primary

#DB5FD8 - A rich, vibrant purple, ideal for main headings, call-to-action buttons, or key elements needing a strong, playful presence.

secondary

#E67EE1 - A bright, enchanting pink-purple, excellent for subheadings, secondary interactive elements, or to add a dynamic pop of color.

accent

#F199E8 - A soft, glowing pink, perfect for subtle highlights, interactive states, or small graphical elements that need to shimmer.

background

#FBE4F4 - A very light, airy pink background that provides a gentle and inviting canvas, allowing darker elements to stand out gracefully.

text

#DB5FD8 - Best for body text against lighter backgrounds like #FBE4F4 or #F8BFEF, ensuring good readability while maintaining the palette's whimsical feel. For higher contrast, use charcoal.

Accessibility notes

  • Ensure #DB5FD8 text on #FBE4F4 background meets WCAG contrast standards for clear readability.
  • Avoid using #F8BFEF or #FBE4F4 as text colors on similar light backgrounds due to very low contrast.
  • Be cautious with #F199E8 for text on lighter pinks; verify readability for critical information.
  • For extensive body text, consider a very dark grey or black to ensure maximum readability for all users, especially with pastel palettes.

Recommended combinations

Dreamy Clouds

For enchanting hero sections or background gradients, creating a soft, ethereal atmosphere.

#DB5FD8 · #E67EE1 · #FBE4F4

Sweet Gradient

Ideal for layered illustrations or subtle UI elements, showing a progression from light to vivid.

#F8BFEF · #F199E8 · #E67EE1

Whimsical Pop

Effective for content cards or playful branding elements, offering a light base with vibrant, delightful accents.

#FBE4F4 · #DB5FD8 · #F199E8

CSS variables

:root {
  --fluffy-cloud-treat-1: #FBE4F4;
  --fluffy-cloud-treat-2: #F8BFEF;
  --fluffy-cloud-treat-3: #F199E8;
  --fluffy-cloud-treat-4: #E67EE1;
  --fluffy-cloud-treat-5: #DB5FD8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "fluffy-cloud-treat": {
        1: "#FBE4F4",
        2: "#F8BFEF",
        3: "#F199E8",
        4: "#E67EE1",
        5: "#DB5FD8",
      }
    }
  }
}

Related searches

pastel pink purple palettesweet candy colorswhimsical design schemefluffy cloud aestheticdreamy UI colors

Palette colors

Hex values

Color 1#FBE4F4
·
Color 2#F8BFEF
·
Color 3#F199E8
·
Color 4#E67EE1
·
Color 5#DB5FD8
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.7:1Fail
2.1:1Fail
2.6:1Fail
2
1.3:1Fail
1.3:1Fail
1.6:1Fail
2.1:1Fail
3
1.7:1Fail
1.3:1Fail
1.2:1Fail
1.6:1Fail
4
2.1:1Fail
1.6:1Fail
1.2:1Fail
1.3:1Fail
5
2.6:1Fail
2.1:1Fail
1.6:1Fail
1.3:1Fail

Similar palettes

More like Fluffy Cloud Treat

View all pastel
Jellybean Jamboree
Whimsical Candy Shop
Bubblegum Carnival Pop
Bubblegum Dream Cloud
Bubblegum Dream Pop
Candy Cloud Dream