Back to palettes

Palette

Gumball Machine Joy

A delightful explosion of sugary hues, reminiscent of childhood candies and sweet treats.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Gumball Machine Joy 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 Gumball Machine Joy.

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

Data visualization

#FF99CC#ADD8E6#FFFF99#99FF99#CC99FF

Palette guide

How to use Gumball Machine Joy

Overview

The Gumball Machine Joy palette is a delightful explosion of pastel hues, perfect for projects aiming for a playful and cheerful aesthetic. Featuring soft pink (#FF99CC), gentle blue (#ADD8E6), sunny yellow (#FFFF99), fresh green (#99FF99), and whimsical lavender (#CC99FF), this collection evokes childhood memories and sweet treats. Designers can leverage these light, airy tones to create welcoming and fun user interfaces, branding for children's products, or whimsical illustrations. Its inherently sweet nature makes it ideal for evoking happiness and approachability. This palette encourages creativity with its soft yet distinct color separation, offering a versatile range for various design elements without overwhelming the viewer. It's a fantastic choice for adding a touch of innocent charm.

Best used for

  • Children's product branding
  • Sweet shop or bakery websites
  • Playful mobile app UI
  • Whimsical illustration and animation
  • Party invitations and decorations
  • Toy packaging design

Suggested color roles

primary

#FF99CC - Use this soft pink for main branding elements, headers, or hero sections to establish a sweet, welcoming tone.

secondary

#ADD8E6 - This gentle blue complements the primary, ideal for subheadings, background accents, or secondary interactive elements.

accent

#FFFF99 - Provides a bright, cheerful pop for call-to-action buttons, icons, or subtle highlights, drawing attention playfully.

background

#99FF99 - A light, calming base that allows other playful colors to stand out, perfect for content areas or subtle page backgrounds.

text

For optimal readability, use a dark neutral like charcoal grey or black for body text. #CC99FF can be used for decorative headings or larger type.

Accessibility notes

  • Ensure sufficient contrast for text, especially when pairing light text with any of these pastel backgrounds.
  • Always use dark text (e.g., black, dark grey) for body content to meet WCAG readability standards.
  • Avoid using light-colored text on light backgrounds (e.g., white text on #ADD8E6) without careful contrast checking.
  • When using #CC99FF for text, ensure it's on a sufficiently light background or is large/bold enough for legibility.

Recommended combinations

Sweet & Gentle

Ideal for soft, inviting interfaces, children's book layouts, or delicate branding.

#FF99CC · #ADD8E6 · #FFFF99

Playful Pop

Creates a vibrant, energetic feel for fun illustrations, event promotions, or playful app elements.

#99FF99 · #CC99FF · #FF99CC

Airy & Bright

Excellent for clean, fresh designs, offering an optimistic and light mood for web headers or infographics.

#ADD8E6 · #FFFF99 · #99FF99

CSS variables

:root {
  --gumball-machine-joy-1: #FF99CC;
  --gumball-machine-joy-2: #ADD8E6;
  --gumball-machine-joy-3: #FFFF99;
  --gumball-machine-joy-4: #99FF99;
  --gumball-machine-joy-5: #CC99FF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "gumball-machine-joy": {
        1: "#FF99CC",
        2: "#ADD8E6",
        3: "#FFFF99",
        4: "#99FF99",
        5: "#CC99FF",
      }
    }
  }
}

Related searches

pastel color schemeplayful design palettesweet candy colorslight cheerful brandingsoft vibrant colors

Palette colors

Hex values

Color 1#FF99CC
·
Color 2#ADD8E6
·
Color 3#FFFF99
·
Color 4#99FF99
·
Color 5#CC99FF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.9:1Fail
1.6:1Fail
1.1:1Fail
2
1.3:1Fail
1.5:1Fail
1.2:1Fail
1.4:1Fail
3
1.9:1Fail
1.5:1Fail
1.2:1Fail
2.1:1Fail
4
1.6:1Fail
1.2:1Fail
1.2:1Fail
1.8:1Fail
5
1.1:1Fail
1.4:1Fail
2.1:1Fail
1.8:1Fail

Similar palettes

More like Gumball Machine Joy

View all pastel
Candy Shop Delights
Whimsical Candy Land
Whimsy Sugar Confection
Bubblegum Carnival Pop
Bubblegum Pop Sky
Candy Cloud Dream