Palette

Retro Pop Fizz

A lively explosion of bold, contrasting colors inspired by bubblegum, soda pop, and vintage cartoon aesthetics.

vibrantplayful5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Retro Pop Fizz 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 Retro Pop Fizz.

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

Data visualization

#EF476F#FFD166#06D6A0#118AB2#073B4C

Palette guide

How to use Retro Pop Fizz

Overview

The Retro Pop Fizz palette is a lively explosion of bold, contrasting colors inspired by bubblegum, soda pop, and vintage cartoon aesthetics. Featuring a cheerful Coral Pink (#EF476F), sunny Light Orange (#FFD166), vibrant Emerald Green (#06D6A0), cool Steel Blue (#118AB2), and a deep Dark Teal (#073B4C), this palette is excellent for designers and developers who want to infuse their projects with a fun, retro, and playful energy. Its carefully balanced contrasts allow for both striking impact and versatile application, perfect for creating dynamic and engaging visual experiences.

Best used for

Youth-focused product branding and packaging
Digital marketing for casual games and entertainment apps
Editorial design for fun and quirky magazines
Social media campaigns with a playful and energetic tone
Event branding for creative workshops and youth events
Website and app UI with a cheerful and engaging vibe

Suggested color roles

primary

Use #EF476F (Coral Pink) as an inviting, cheerful main brand color, or for prominent, playful elements.

secondary

Apply #118AB2 (Steel Blue) to provide a stable, professional, and balancing element within the vibrant mix.

accent

Leverage #FFD166 (Light Orange) or #06D6A0 (Emerald Green) for vibrant highlights, interactive states, and playful details.

background

The deep #073B4C (Dark Teal) offers a dramatic, rich backdrop, or use a very light off-white (not in palette) to let the colors pop.

text

White or #FFD166 works well for headings on #073B4C. Use black or #073B4C for body text on lighter backgrounds for readability.

Accessibility notes

White text on #073B4C, #118AB2, and #06D6A0 will offer good contrast and readability.
Ensure #FFD166 text on #EF476F has enough contrast for legibility, especially for smaller text.
The combination of #EF476F on #073B4C creates a vibrant yet readable pairing for headings.
Test all color combinations for WCAG AA/AAA compliance, particularly for small text and critical UI elements.

Recommended combinations

Vibrant Pop

For energetic branding, striking headlines, and playful illustrations that command attention.

#EF476F · #FFD166 · #073B4C

Coastal Fizz

Ideal for summer promotions, travel blogs, and refreshing UI elements with a cool, inviting feel.

#118AB2 · #06D6A0 · #FFD166

Deep Contrast

Perfect for dark mode UI, bold marketing materials, and sophisticated yet playful designs.

#073B4C · #EF476F · #FFD166

CSS variables

:root {
  --retro-pop-fizz-1: #EF476F;
  --retro-pop-fizz-2: #FFD166;
  --retro-pop-fizz-3: #06D6A0;
  --retro-pop-fizz-4: #118AB2;
  --retro-pop-fizz-5: #073B4C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-pop-fizz": {
        1: "#EF476F",
        2: "#FFD166",
        3: "#06D6A0",
        4: "#118AB2",
        5: "#073B4C",
      }
    }
  }
}

Hex values

Color 1#EF476F

Color 2#FFD166

Color 3#06D6A0

Color 4#118AB2

Color 5#073B4C

Accessibility

Contrast checker

2.5:1Fail

1.9:1Fail

1.1:1Fail

3.3:1AA18

2.5:1Fail

1.3:1Fail

2.7:1Fail

8.4:1AAA

1.9:1Fail

1.3:1Fail

2.1:1Fail

6.4:1AA

1.1:1Fail

2.7:1Fail

2.1:1Fail

3:1AA18

3.3:1AA18

8.4:1AAA

6.4:1AA

3:1AA18

Similar palettes

More like Retro Pop Fizz

View all vibrant

Vintage Candy Wrapper

Atomic Diner Swirl

Bubblegum Pop Burst

Carnival Carousel Fun

Carnival Pop Delight

Circus Tent Burst