Palette

Retro Wave

Electric purples, blues, and neon pinks radiate a nostalgic 80s synthwave aesthetic, full of energetic vibes.

vibrantretro5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#8A2BE2#4169E1#FF1493#FFD700#00FFFF

Palette guide

How to use Retro Wave

Overview

The Retro Wave palette perfectly encapsulates the electric purples, blues, and neon pinks of a nostalgic 80s synthwave aesthetic. This vibrant scheme features a rich blue-violet (#8A2BE2), a strong royal blue (#4169E1), a dazzling deep pink (#FF1493), a bright gold (#FFD700), and an electrifying aqua (#00FFFF). Designers can harness these energetic hues to create dynamic, futuristic, and highly stylized visuals. It's an excellent choice for projects aiming to evoke a sense of digital nostalgia, energy, and bold visual flair.

Best used for

Synthwave music album art and promotions
Retro-futuristic gaming interfaces
Nightlife and event branding
Digital art and illustration with an 80s twist
Tech product interfaces and marketing
Fashion lines inspired by vaporwave aesthetics

Suggested color roles

primary

Use #8A2BE2 (Blue Violet) or #4169E1 (Royal Blue) as a dominant background or primary branding color for depth.

secondary

Apply #FF1493 (Deep Pink) or #00FFFF (Aqua) for prominent headers, buttons, or key visual elements.

accent

Incorporate #FFD700 (Gold) for glowing details, highlights, or subtle metallic effects.

background

A deep, dark background (like black or a very dark navy, not in palette) is recommended to maximize the neon glow of these colors.

text

White or a light grey offers the best contrast for body text. Use #FFD700 or #00FFFF for headings or call-to-action text on dark backgrounds.

Accessibility notes

Ensure sufficient contrast when using bright colors on other bright colors; generally, pair them with a dark background.
Avoid using #FFD700 for small body text as its luminosity can be challenging to read on some backgrounds.
Utilize #8A2BE2 or #4169E1 for larger text elements on a dark background for better legibility.
Be mindful of the intensity of neon colors for users sensitive to bright contrasts; provide alternatives if possible.

Recommended combinations

Neon Glow

Excellent for creating vibrant digital landscapes, UI elements, or striking visual accents.

#8A2BE2 · #FF1493 · #00FFFF

Electric Sunset

Ideal for dynamic gradients, sunset-inspired backdrops, or energetic marketing visuals.

#4169E1 · #FFD700 · #FF1493

Cyber Haze

Perfect for creating atmospheric backgrounds, futuristic interfaces, or abstract art.

#8A2BE2 · #00FFFF · #4169E1

CSS variables

:root {
  --retro-wave-1: #8A2BE2;
  --retro-wave-2: #4169E1;
  --retro-wave-3: #FF1493;
  --retro-wave-4: #FFD700;
  --retro-wave-5: #00FFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-wave": {
        1: "#8A2BE2",
        2: "#4169E1",
        3: "#FF1493",
        4: "#FFD700",
        5: "#00FFFF",
      }
    }
  }
}

Hex values

Color 1#8A2BE2

Color 2#4169E1

Color 3#FF1493

Color 4#FFD700

Color 5#00FFFF

Accessibility

Contrast checker

1.2:1Fail

1.6:1Fail

4.2:1AA18

4.8:1AA

1.2:1Fail

1.3:1Fail

3.5:1AA18

3.9:1AA18

1.6:1Fail

1.3:1Fail

2.6:1Fail

2.9:1Fail

4.2:1AA18

3.5:1AA18

2.6:1Fail

1.1:1Fail

4.8:1AA

3.9:1AA18

2.9:1Fail

1.1:1Fail

Similar palettes

More like Retro Wave

View all vibrant

Synthwave Sundown Grid

Electric Synthwave Drive