Back to palettes

Palette

Retro Synth Wave

Bold, electric hues that pulse with the nostalgic, vibrant energy of 80s synthwave aesthetics.

vibrantretro5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Retro Synth Wave 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 Synth Wave.

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

Data visualization

#FF00FF#00FFFF#FFD700#800080#000000

Palette guide

How to use Retro Synth Wave

Overview

The Retro Synth Wave palette pulses with the nostalgic, vibrant energy of 80s synthwave aesthetics, featuring bold, electric hues ideal for designers and developers seeking a futuristic retro vibe. It includes a striking magenta (#FF00FF), a cool cyan (#00FFFF), a bright gold (#FFD700), a deep purple (#800080), and a grounding black (#000000). This palette is perfect for creating designs that are edgy, dynamic, and full of digital character. Use #000000 as a dominant, deep base and #FF00FF for electrifying neon highlights to truly capture the essence of the 80s digital era.

Best used for

  • Synthwave music album art and visuals
  • 80s arcade game interfaces and graphics
  • Cyberpunk-themed digital art and illustrations
  • Event promotions for retro-themed parties
  • Twitch stream overlays and content creation
  • Fashion designs with a futuristic, neon edge

Suggested color roles

primary

Use #000000 as the dominant, deep base, providing a powerful canvas for neon elements to emerge.

secondary

Employ #FF00FF as an electric, vibrant highlight, like neon lights, for strong visual impact.

accent

Apply #00FFFF as a cool, digital glow, adding contrast, depth, and a sci-fi feel.

background

Utilize #800080 as a moody, atmospheric backdrop, offering subtle depth behind brighter elements.

text

Consider #FFD700 for bright, legible text against dark backgrounds, ensuring high visibility.

Accessibility notes

  • Ensure high contrast for text, especially when using #FFD700, #FF00FF, or #00FFFF against #000000 or #800080.
  • Avoid using #800080 for text on #000000 due to insufficient contrast, which impairs readability.
  • The bright neon colors are excellent for headlines and prominent text against a black background.
  • Always test color combinations for readability, particularly for users with color vision deficiencies.

Recommended combinations

Neon Grid

A classic synthwave combo for dark backgrounds with vivid highlights, ideal for digital interfaces.

#000000 · #FF00FF · #00FFFF

Sunset Glow

A purple base with warm yellow and magenta for a dreamy, electric feel in backgrounds or illustrations.

#800080 · #FFD700 · #FF00FF

Cyber Pulse

Cyan and magenta against black for strong, futuristic graphics, logos, or animated elements.

#00FFFF · #FF00FF · #000000

CSS variables

:root {
  --retro-synth-wave-2-1: #FF00FF;
  --retro-synth-wave-2-2: #00FFFF;
  --retro-synth-wave-2-3: #FFD700;
  --retro-synth-wave-2-4: #800080;
  --retro-synth-wave-2-5: #000000;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-synth-wave-2": {
        1: "#FF00FF",
        2: "#00FFFF",
        3: "#FFD700",
        4: "#800080",
        5: "#000000",
      }
    }
  }
}

Related searches

80s neon color palettesynthwave aesthetic colorscyberpunk color schemeretro futuristic designdark mode neon palette

Palette colors

Hex values

Color 1#FF00FF
·
Color 2#00FFFF
·
Color 3#FFD700
·
Color 4#800080
·
Color 5#000000
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.5:1Fail
2.2:1Fail
3:1AA18
6.7:1AA
2
2.5:1Fail
1.1:1Fail
7.5:1AAA
16.7:1AAA
3
2.2:1Fail
1.1:1Fail
6.7:1AA
15:1AAA
4
3:1AA18
7.5:1AAA
6.7:1AA
2.2:1Fail
5
6.7:1AA
16.7:1AAA
15:1AAA
2.2:1Fail

Similar palettes

More like Retro Synth Wave

View all vibrant