Palette

Retro Pop Vibe

A bold and cheerful palette bursting with the vibrant, carefree energy of retro pop art.

vibrantretro5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#F72C2C#F9DC5C#36AF9C#2E86AB#B83B5E

Palette guide

How to use Retro Pop Vibe

Overview

The Retro Pop Vibe palette bursts with the vibrant, carefree energy of retro pop art, offering a bold and cheerful aesthetic. This dynamic collection includes a striking Bright Red (#F72C2C), sunny Golden Yellow (#F9DC5C), serene Teal (#36AF9C), deep Deep Sky Blue (#2E86AB), and a rich Rosewood (#B83B5E). Ideal for designers and developers aiming to create impactful, fun, and memorable visuals, this palette leverages strong contrasts and energetic hues to convey a sense of playful optimism and distinctive retro flair, perfect for standing out in digital and print media.

Best used for

Creative marketing campaigns and advertising
Brand identity for startups and innovative businesses
Social media templates and content creation
Event posters and flyers for fun gatherings
Fashion and lifestyle blogging and e-commerce
Digital art and illustrations with a bold, graphic style

Suggested color roles

primary

Utilize #F72C2C (Bright Red) for commanding attention, energetic calls to action, or as a dominant brand color.

secondary

Apply #2E86AB (Deep Sky Blue) to provide a stable, professional, and balancing element against the warmer tones.

accent

Leverage #F9DC5C (Golden Yellow), #36AF9C (Teal), or #B83B5E (Rosewood) for vibrant highlights, interactive elements, and playful details.

background

A very light grey or off-white (not in palette) would serve as an ideal backdrop, allowing the bold colors to shine brilliantly.

text

Dark charcoal or black is recommended for body text on lighter backgrounds to ensure maximum readability and clarity.

Accessibility notes

Ensure #F9DC5C has sufficient contrast on light backgrounds; consider #2E86AB or black for text overlays.
#F72C2C and #B83B5E contrast well with lighter colors and white text, making them suitable for headings.
Use #2E86AB or #36AF9C for body text on light backgrounds to ensure excellent legibility.
Test all color combinations for WCAG AA/AAA compliance, especially for critical user interface elements and small text.

Recommended combinations

Vibrant Contrast

For bold headlines, impactful banners, and energetic UI elements that demand immediate attention.

#F72C2C · #F9DC5C · #2E86AB

Retro Cool

Ideal for modern retro branding, web design, and cool-toned accents that feel fresh and inviting.

#36AF9C · #2E86AB · #F9DC5C

Warm Pop

Perfect for inviting calls to action, festive graphics, and warm-toned illustrations with a playful vibe.

#B83B5E · #F72C2C · #F9DC5C

CSS variables

:root {
  --retro-pop-vibe-1: #F72C2C;
  --retro-pop-vibe-2: #F9DC5C;
  --retro-pop-vibe-3: #36AF9C;
  --retro-pop-vibe-4: #2E86AB;
  --retro-pop-vibe-5: #B83B5E;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-pop-vibe": {
        1: "#F72C2C",
        2: "#F9DC5C",
        3: "#36AF9C",
        4: "#2E86AB",
        5: "#B83B5E",
      }
    }
  }
}

Hex values

Color 1#F72C2C

Color 2#F9DC5C

Color 3#36AF9C

Color 4#2E86AB

Color 5#B83B5E

Accessibility

Contrast checker

2.9:1Fail

1.5:1Fail

1:1Fail

1.4:1Fail

2.9:1Fail

2:1Fail

3:1AA18

4:1AA18

1.5:1Fail

2:1Fail

1.5:1Fail

2:1Fail

1:1Fail

3:1AA18

1.5:1Fail

1.3:1Fail

1.4:1Fail

4:1AA18

2:1Fail

1.3:1Fail

Similar palettes

More like Retro Pop Vibe

Retro Pop Vibe

See it in context.

Ready when you are.

Built with Retro Pop Vibe.

How to use Retro Pop Vibe

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Vibrant Contrast

Retro Cool

Warm Pop

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Retro Pop Vibe