Palette

Playful Circus Pop

A joyous burst of color reminiscent of a lively, old-fashioned circus performance.

vibrantplayful5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Playful Circus Pop 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 Playful Circus Pop.

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

Data visualization

#FE4A49#FFC22B#2AB7CA#FED766#E6E6EA

Palette guide

How to use Playful Circus Pop

Overview

The Playful Circus Pop palette is a joyous burst of color reminiscent of a lively, old-fashioned circus performance. It features a bold red (#FE4A49), a brilliant golden yellow (#FFC22B), a vibrant cyan (#2AB7CA), a soft cream yellow (#FED766), and a versatile light gray (#E6E6EA). This palette is exceptionally useful for designers aiming to evoke nostalgia, fun, and approachability. The inclusion of a neutral gray provides balance to the otherwise vibrant hues. Developers will find these distinct hex codes easy to implement for creating clear visual hierarchies and an engaging user experience, perfect for applications or websites with a cheerful and classic aesthetic.

Best used for

Retro-themed branding and packaging
Children's entertainment and media
Event invitations (circus, fairground)
Mobile game UI/UX with a vintage twist
Creative educational content
Food and beverage branding (e.g., popcorn, candy)

Suggested color roles

primary

Use the bold red (#FE4A49) for calls-to-action, key headlines, or brand elements that require immediate attention and a classic feel.

secondary

The brilliant golden yellow (#FFC22B) is excellent for secondary buttons, highlights, or to add warmth and cheerfulness.

accent

Apply the vibrant cyan (#2AB7CA) for interactive states, notifications, or small, impactful details to introduce a refreshing contrast.

background

The light gray (#E6E6EA) serves as an ideal clean background, allowing the vibrant colors to pop. The soft cream yellow (#FED766) can also be used for lighter background sections.

text

For optimal readability, use a dark charcoal or black text on light backgrounds. On #FE4A49 or #2AB7CA, a crisp white is highly recommended.

Accessibility notes

Ensure sufficient contrast for #FE4A49 and #FFC22B when used with white text; black text is often safer.
The soft cream yellow #FED766 will require dark text (e.g., black or #FE4A49) to pass WCAG AA standards.
Avoid pairing #FFC22B with #FED766 for critical information due to potential low contrast.
White text generally works well on #2AB7CA, but always verify contrast ratios, especially against #E6E6EA.

Recommended combinations

Classic Circus

Ideal for bold headers, promotional graphics, or branding that aims for a nostalgic, vibrant feel.

#FE4A49 · #FFC22B · #E6E6EA

Bright & Balanced

Creates a cheerful and harmonious look, suitable for illustrations, infographics, or secondary content blocks.

#2AB7CA · #FED766 · #FE4A49

Subtle Pop

Effective for clean UI elements, subtle highlights, or sections where vibrancy is needed but balanced by neutrality.

#E6E6EA · #FFC22B · #2AB7CA

CSS variables

:root {
  --playful-circus-pop-1: #FE4A49;
  --playful-circus-pop-2: #FFC22B;
  --playful-circus-pop-3: #2AB7CA;
  --playful-circus-pop-4: #FED766;
  --playful-circus-pop-5: #E6E6EA;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "playful-circus-pop": {
        1: "#FE4A49",
        2: "#FFC22B",
        3: "#2AB7CA",
        4: "#FED766",
        5: "#E6E6EA",
      }
    }
  }
}

Hex values

Color 1#FE4A49

Color 2#FFC22B

Color 3#2AB7CA

Color 4#FED766

Color 5#E6E6EA

Accessibility

Contrast checker

2.1:1Fail

1.4:1Fail

2.4:1Fail

2.7:1Fail

2.1:1Fail

1.5:1Fail

1.2:1Fail

1.3:1Fail

1.4:1Fail

1.5:1Fail

1.7:1Fail

1.9:1Fail

2.4:1Fail

1.2:1Fail

1.7:1Fail

1.1:1Fail

2.7:1Fail

1.3:1Fail

1.9:1Fail

1.1:1Fail

Similar palettes

More like Playful Circus Pop

View all vibrant

Bright Carnival Spin

Bright Carnival Swirl

Bright Fairground Lights

Carnival Bright Spark

Carnival Carousel Fun

Carnival Carousel Ride