Palette

Retro Candy Strip

Bold and cheerful colors that bring to mind classic retro candy strips and delightful childhood sweets.

vibrantplayful5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Retro Candy Strip 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 Candy Strip.

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

Data visualization

#FF0080#FFD700#00FF00#0080FF#FF00FF

Palette guide

How to use Retro Candy Strip

Overview

The "Retro Candy Strip" palette is a captivating blend of bold, almost neon-like primary and secondary colors, designed to instantly transport users to a world of playful nostalgia. With a vivid fuchsia (#FF0080), a rich gold (#FFD700), an electric green (#00FF00), a bright royal blue (#0080FF), and a striking magenta (#FF00FF), this collection is built for maximum visual impact. Designers will find these hues excellent for creating energetic, pop-art inspired visuals, while developers can utilize their distinctiveness for clear UI segmentation and engaging interactive elements. This palette is ideal for projects that demand a high level of vibrancy and a memorable, fun aesthetic.

Best used for

Event posters and flyers
Retro arcade game interfaces
Fashion and apparel branding
Music festival promotions
Youth-oriented digital products
Bold social media graphics

Suggested color roles

primary

A striking and energetic primary, perfect for headlines, calls-to-action, or dominant branding elements using #FF0080.

secondary

A strong, cool secondary to provide contrast and depth, ideal for navigation or supporting graphic areas using #0080FF.

accent

A bright, luxurious accent for highlights, interactive states, or small, attention-grabbing details using #FFD700.

background

A highly energetic background for sections intended to be very eye-catching using #00FF00. For general use, consider a neutral light grey or off-white, using this for vibrant overlays.

text

Use black or dark charcoal for text on #FFD700 and #00FF00. White text will provide excellent contrast on #FF0080, #0080FF, and #FF00FF.

Accessibility notes

#00FF00 and #FFD700 are very bright; ensure dark text (e.g., black) is used for readability on these backgrounds.
High contrast is generally achievable, but test combinations like #FF0080 text on #FF00FF background for sufficient differentiation.
Avoid using #00FF00 as a background for extensive body text due to its high saturation and potential for eye strain.
Verify all text and interactive element contrasts meet WCAG 2.1 AA standards, especially with the vibrant hues.

Recommended combinations

Electric CTA

Fuchsia for the main button, blue for text, and gold for a glowing highlight or icon.

#FF0080 · #0080FF · #FFD700

Vibrant Pattern

Create dynamic, alternating stripes or geometric patterns for backgrounds or borders.

#00FF00 · #FF00FF · #FF0080

Pop Art Text

Use gold for a main headline, blue for subtext, and fuchsia for an underlined or emphasized word.

#FFD700 · #0080FF · #FF0080

CSS variables

:root {
  --retro-candy-strip-1: #FF0080;
  --retro-candy-strip-2: #FFD700;
  --retro-candy-strip-3: #00FF00;
  --retro-candy-strip-4: #0080FF;
  --retro-candy-strip-5: #FF00FF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-candy-strip": {
        1: "#FF0080",
        2: "#FFD700",
        3: "#00FF00",
        4: "#0080FF",
        5: "#FF00FF",
      }
    }
  }
}

Hex values

Color 1#FF0080

Color 2#FFD700

Color 3#00FF00

Color 4#0080FF

Color 5#FF00FF

Accessibility

Contrast checker

2.7:1Fail

2.8:1Fail

1:1Fail

1.2:1Fail

2.7:1Fail

1:1Fail

2.7:1Fail

2.2:1Fail

2.8:1Fail

1:1Fail

2.8:1Fail

2.3:1Fail

1:1Fail

2.7:1Fail

2.8:1Fail

1.2:1Fail

2.2:1Fail

2.3:1Fail

1.2:1Fail

Similar palettes

More like Retro Candy Strip

Retro Candy Strip

See it in context.

Ready when you are.

Built with Retro Candy Strip.

How to use Retro Candy Strip

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Electric CTA

Vibrant Pattern

Pop Art Text

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Retro Candy Strip