Palette

Circus Tent Whimsy

Classic primary colors that capture the whimsical and bold spirit of a traditional circus tent.

vibrantplayful5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Circus Tent Whimsy 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 Circus Tent Whimsy.

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

Data visualization

#FF0000#FFCC00#0066CC#FFFFFF#000000

Palette guide

How to use Circus Tent Whimsy

Overview

The Circus Tent Whimsy palette features classic primary colors that capture the whimsical and bold spirit of a traditional circus tent. With iconic hues like vibrant #FF0000 (red), cheerful #FFCC00 (amber), bold #0066CC (cobalt blue), crisp #FFFFFF (white), and strong #000000 (black), this palette is perfect for projects demanding a clear, playful, or graphic aesthetic. Designers can leverage these colors to create visually arresting digital experiences, strong branding, or iconic illustrations. Developers will find these hex codes straightforward for implementing dynamic animations, interactive UI elements, or vibrant marketing materials, ensuring a memorable and energetic user interaction across various platforms.

Best used for

traditional circus branding
children's book illustrations
bold graphic design projects
toy packaging and design
event and party invitations
retro poster design

Suggested color roles

primary

The vibrant #FF0000 (red) serves as a bold primary, drawing immediate attention and setting a classic, energetic tone for key elements.

secondary

The cheerful #FFCC00 (amber yellow) provides a bright secondary option, ideal for subheadings, interactive elements, or to add an optimistic touch.

accent

The bold #0066CC (cobalt blue) serves as an excellent accent, perfect for calls-to-action or highlighting important details with a strong, playful punch.

background

The crisp #FFFFFF (white) creates a clean, bright background, allowing the vibrant colors to pop and enhancing readability. For a dramatic background, use #000000.

text

Pure #000000 (black) offers maximum contrast for text against the lighter vibrant colors and white. White text can be used on the darker shades like #FF0000 or #0066CC.

Accessibility notes

Always pair vibrant colors like #FF0000, #FFCC00, and #0066CC with #FFFFFF or #000000 for text to ensure WCAG compliance.
Avoid using #FFCC00 text on #FFFFFF background without careful contrast checking.
Be mindful of color blindness; rely on more than just color to convey information when using these intense hues.
Large text sizes are recommended if using two palette colors for text/background, or use very dark/light non-palette colors for text.

Recommended combinations

Classic Primary

Combine for iconic branding, bold illustrations, or high-energy visual effects.

#FF0000 · #FFCC00 · #0066CC

Graphic Contrast

Excellent for creating strong visual hierarchy, clear text, or impactful graphic elements.

#FFFFFF · #000000 · #FF0000

Tent Stripes

Ideal for creating stripes, patterns, or layered elements with a traditional circus feel.

#FF0000 · #FFCC00 · #FFFFFF

CSS variables

:root {
  --circus-tent-whimsy-1: #FF0000;
  --circus-tent-whimsy-2: #FFCC00;
  --circus-tent-whimsy-3: #0066CC;
  --circus-tent-whimsy-4: #FFFFFF;
  --circus-tent-whimsy-5: #000000;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "circus-tent-whimsy": {
        1: "#FF0000",
        2: "#FFCC00",
        3: "#0066CC",
        4: "#FFFFFF",
        5: "#000000",
      }
    }
  }
}

Hex values

Color 1#FF0000

Color 2#FFCC00

Color 3#0066CC

Color 4#FFFFFF

Color 5#000000

Accessibility

Contrast checker

2.6:1Fail

1.4:1Fail

4:1AA18

5.3:1AA

2.6:1Fail

3.7:1AA18

1.5:1Fail

13.9:1AAA

1.4:1Fail

3.7:1AA18

5.6:1AA

3.8:1AA18

4:1AA18

1.5:1Fail

5.6:1AA

21:1AAA

5.3:1AA

13.9:1AAA

3.8:1AA18

21:1AAA

Similar palettes

More like Circus Tent Whimsy

View all vibrant

Carnival Merry-Go-Round