Back to palettes

Palette

Confetti Cloud Burst

A joyous explosion of light and playful pastels, like confetti scattering through a sunny sky.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Confetti Cloud Burst 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 Confetti Cloud Burst.

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

Data visualization

#FFB6C1#FFF0B5#C7EDF0#F3C3D7#A0D7EC

Palette guide

How to use Confetti Cloud Burst

Overview

The Confetti Cloud Burst palette offers a delightful array of soft, playful pastels perfect for infusing joy and lightness into any design. Featuring gentle pinks like #FFB6C1, sunny yellows such as #FFF0B5, and serene blues including #C7EDF0 and #A0D7EC, this collection is reminiscent of a celebration under a clear sky. Designers can leverage these light, airy tones to create welcoming and cheerful interfaces, branding, or illustrations. The subtle variation, like #F3C3D7, ensures enough depth while maintaining a consistently soft aesthetic. It's an excellent choice for projects requiring a touch of whimsy and approachability.

Best used for

  • Children's product branding and packaging
  • Event invitations and party decor websites
  • Playful mobile app interfaces
  • Spring/summer fashion lookbooks
  • Sweet shop or bakery branding
  • Creative art and illustration projects

Suggested color roles

primary

Use #A0D7EC as a calming yet cheerful primary background or dominant element.

secondary

Complement with #FFB6C1 for headers, buttons, or secondary sections to add warmth.

accent

Incorporate #FFF0B5 as a bright, playful accent for calls-to-action or highlighted content.

background

Utilize #C7EDF0 for large background areas, providing a fresh, airy canvas.

text

For optimal readability, use a dark grey or charcoal text color on these light backgrounds.

Accessibility notes

  • Ensure sufficient contrast for all text elements, as these pastels are very light.
  • Pair darker text (e.g., #333333) with #FFF0B5 and #C7EDF0 for improved readability.
  • Avoid placing light text directly on light pastel backgrounds without careful contrast checking.
  • Consider using a slightly darker version of the palette colors for borders or outlines to define elements.

Recommended combinations

Sunny Delight

Ideal for cheerful banners, subtle gradients, or highlighting sweet content.

#FFF0B5 · #FFB6C1 · #C7EDF0

Sky & Cloud

Excellent for serene backgrounds, header sections, or calming informational blocks.

#C7EDF0 · #A0D7EC · #FFF0B5

Playful Pop

Use for playful illustrations, infographics, or multi-colored UI elements.

#F3C3D7 · #A0D7EC · #FFF0B5

CSS variables

:root {
  --confetti-cloud-burst-1: #FFB6C1;
  --confetti-cloud-burst-2: #FFF0B5;
  --confetti-cloud-burst-3: #C7EDF0;
  --confetti-cloud-burst-4: #F3C3D7;
  --confetti-cloud-burst-5: #A0D7EC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "confetti-cloud-burst": {
        1: "#FFB6C1",
        2: "#FFF0B5",
        3: "#C7EDF0",
        4: "#F3C3D7",
        5: "#A0D7EC",
      }
    }
  }
}

Related searches

playful pastel color schemessoft cheerful brand colorslight spring palette hex codescolorful confetti design inspirationairy pastel UI colors

Palette colors

Hex values

Color 1#FFB6C1
·
Color 2#FFF0B5
·
Color 3#C7EDF0
·
Color 4#F3C3D7
·
Color 5#A0D7EC
·

Accessibility

Contrast checker

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

Similar palettes

More like Confetti Cloud Burst

View all pastel
Sweet Shop Candy
Candy Land Carnival
Candy Shop Whimsy
Candyland Parade
Flamingo Feather
Jolly Confectionery Dream