Palette

Retro Futurism Funk

An explosive, energetic blend reminiscent of 80s aesthetics and imagined futures.

vibrantretro5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Retro Futurism Funk 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 Futurism Funk.

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

Data visualization

#FF00FF#00FF00#FFFF00#FF8C00#9400D3

Palette guide

How to use Retro Futurism Funk

Overview

The Retro Futurism Funk palette is an explosive, energetic blend reminiscent of 80s aesthetics and imagined futures. With electrifying fuchsia #FF00FF, dynamic lime green #00FF00, and dazzling yellow #FFFF00, it screams vibrancy. A fiery orange #FF8C00 adds warmth, while a deep dark violet #9400D3 provides a dramatic, grounding contrast. This palette is a bold choice for designers and developers aiming to create high-impact, playful, and unforgettable visual experiences. It’s perfect for projects that celebrate the maximalist, synthwave, and pop art sensibilities of the retro-futuristic era.

Best used for

Music branding and album covers
Party and event promotions
Streetwear and youth fashion design
Interactive art installations
Vibrant advertising campaigns
Video game visual effects and UI

Suggested color roles

primary

Use #FF00FF (Fuchsia) for main calls-to-action, prominent headlines, or key brand elements to command attention and convey energy.

secondary

Employ #00FF00 (Lime Green) for complementary sections, secondary buttons, or large graphic elements, adding a dynamic freshness.

accent

Apply #FFFF00 (Yellow) sparingly for ultimate pop, glow effects, or small interactive elements to create a dazzling highlight.

background

Utilize #9400D3 (Dark Violet) as a rich, dramatic background, or a deep charcoal/black for maximum neon impact and contrast.

text

White or #FFFF00 (Yellow) are ideal for headings and important text on dark backgrounds. For larger body text, ensure high contrast with dark charcoal on lighter accents.

Accessibility notes

This palette is very high-energy; contrast will be a major consideration, especially for text. Use dark backgrounds for best readability.
Avoid placing #FFFF00 (Yellow) on #FF8C00 (Orange) for text, as contrast will be insufficient and cause legibility issues.
Ensure white text on #9400D3 (Dark Violet) provides sufficient contrast to meet WCAG guidelines for all text sizes.
Reserve the most vibrant colors for large display text or graphic elements rather than extensive body copy to prevent eye strain.

Recommended combinations

Neon Power

The ultimate neon trio for high-impact hero sections, energetic branding, or dynamic digital artwork.

#FF00FF · #00FF00 · #FFFF00

Funk Fusion

Combines a deep base with fiery and cool accents, ideal for creating dramatic contrasts and playful focal points.

#9400D3 · #FF8C00 · #00FF00

Bold Statement

A powerful combination of a bold primary, bright accent, and dramatic background, perfect for energetic branding.

#FF00FF · #FFFF00 · #9400D3

CSS variables

:root {
  --retro-futurism-funk-1: #FF00FF;
  --retro-futurism-funk-2: #00FF00;
  --retro-futurism-funk-3: #FFFF00;
  --retro-futurism-funk-4: #FF8C00;
  --retro-futurism-funk-5: #9400D3;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-futurism-funk": {
        1: "#FF00FF",
        2: "#00FF00",
        3: "#FFFF00",
        4: "#FF8C00",
        5: "#9400D3",
      }
    }
  }
}

Hex values

Color 1#FF00FF

Color 2#00FF00

Color 3#FFFF00

Color 4#FF8C00

Color 5#9400D3

Accessibility

Contrast checker

2.3:1Fail

2.9:1Fail

1.3:1Fail

2.1:1Fail

2.3:1Fail

1.3:1Fail

1.7:1Fail

4.8:1AA

2.9:1Fail

1.3:1Fail

2.2:1Fail

6.1:1AA

1.3:1Fail

1.7:1Fail

2.2:1Fail

2.8:1Fail

2.1:1Fail

4.8:1AA

6.1:1AA

2.8:1Fail

Similar palettes

More like Retro Futurism Funk

Retro Futurism Funk

See it in context.

Ready when you are.

Built with Retro Futurism Funk.

How to use Retro Futurism Funk

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Neon Power

Funk Fusion

Bold Statement

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Retro Futurism Funk