Back to palettes

Palette

Retro Synthwave

Bold and electric, evoking the nostalgic glow of 80s synthwave aesthetics and arcade nights.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#9B59B6#8E44AD#E74C3C#C0392B#3498DB

Palette guide

How to use Retro Synthwave

Overview

The Retro Synthwave palette is a bold and electric collection that perfectly evokes the nostalgic glow of 80s synthwave aesthetics and arcade nights. Featuring vibrant purples like '#9B59B6' and '#8E44AD', alongside energetic reds '#E74C3C' and '#C0392B', and a striking blue '#3498DB', this palette is designed for impactful visual communication. It offers a rich interplay of cool and warm tones, allowing for dynamic contrasts that capture the high-energy, futuristic yet vintage feel. Ideal for designers and developers crafting experiences that demand a strong, memorable retro-futuristic identity, from digital interfaces to physical products.

Best used for

  • Video game UI and character design for retro-themed games
  • Brand identity for tech startups or entertainment venues
  • Website and mobile app designs with a vibrant, energetic aesthetic
  • Merchandise and apparel with a distinct 80s pop culture vibe
  • Event graphics and promotional materials for retro gaming events
  • Digital art and illustrations inspired by arcade cabinets and neon signs

Suggested color roles

primary

Use '#8E44AD' as a strong foundational purple, providing depth and sophistication for backgrounds or main content areas.

secondary

Employ '#9B59B6' for supporting elements, subheadings, or as a lighter purple accent to add dimension to the primary.

accent

Leverage '#E74C3C' and '#3498DB' for high-impact calls-to-action, key graphics, or to create vibrant contrast and visual interest.

background

A solid '#8E44AD' or '#C0392B' can serve as a dramatic background, allowing brighter elements to pop. '#3498DB' also works for a cooler base.

text

For darker backgrounds like '#8E44AD' or '#C0392B', use white or a very light gray. On lighter colors, a dark gray or black provides optimal readability. '#E74C3C' can be used for impactful headings.

Accessibility notes

  • Ensure sufficient contrast when using '#E74C3C' or '#3498DB' for text on lighter backgrounds like '#9B59B6'.
  • Pair light text (e.g., white) with '#8E44AD' or '#C0392B' for optimal readability.
  • Avoid using '#C0392B' directly on '#E74C3C' for small text due to insufficient contrast.
  • Test color combinations with accessibility tools to meet WCAG guidelines, particularly for interactive elements.

Recommended combinations

Arcade Glow

A classic retro arcade look. '#8E44AD' as a base, with '#E74C3C' and '#3498DB' for neon highlights and interactive elements.

#8E44AD · #E74C3C · #3498DB

Synthwave Pulse

Creates a warm, energetic gradient. '#9B59B6' provides a lighter purple, leading into the vibrant reds for intensity.

#9B59B6 · #E74C3C · #C0392B

Electric Horizon

A cool blue base with purple depth and a fiery red accent, ideal for dynamic interfaces or sci-fi scenes.

#3498DB · #8E44AD · #E74C3C

CSS variables

:root {
  --retro-synthwave-1: #9B59B6;
  --retro-synthwave-2: #8E44AD;
  --retro-synthwave-3: #E74C3C;
  --retro-synthwave-4: #C0392B;
  --retro-synthwave-5: #3498DB;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-synthwave": {
        1: "#9B59B6",
        2: "#8E44AD",
        3: "#E74C3C",
        4: "#C0392B",
        5: "#3498DB",
      }
    }
  }
}

Related searches

80s gaming color schemeretro purple red bluesynthwave UI colorsarcade cabinet palettevibrant retro tech

Palette colors

Hex values

Color 1#9B59B6
·
Color 2#8E44AD
·
Color 3#E74C3C
·
Color 4#C0392B
·
Color 5#3498DB
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.2:1Fail
1.2:1Fail
1.5:1Fail
2
1.3:1Fail
1.5:1Fail
1.1:1Fail
1.9:1Fail
3
1.2:1Fail
1.5:1Fail
1.4:1Fail
1.2:1Fail
4
1.2:1Fail
1.1:1Fail
1.4:1Fail
1.7:1Fail
5
1.5:1Fail
1.9:1Fail
1.2:1Fail
1.7:1Fail

Similar palettes

More like Retro Synthwave

View all vibrant
Retro Arcade Pop
City Neon Rain
Cyber Glow
Cyber Glow Graffiti
Cybernetic Voltage Surge
Electric City Night