Back to palettes

Palette

Vaporwave Synth Pop

A neon-infused retro vibe with bright purples and blues, reminiscent of 80s synth music and digital art.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Vaporwave Synth Pop 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 Vaporwave Synth Pop.

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

Data visualization

#F1A7F0#BE90FF#8D80FF#5B70FF#2E60FF

Palette guide

How to use Vaporwave Synth Pop

Overview

The Vaporwave Synth Pop palette offers a neon-infused retro vibe, reminiscent of 80s synth music and digital art. Dominated by a spectrum of bright purples and blues, from the ethereal #F1A7F0 to the intense #2E60FF, it creates a cohesive and energetic aesthetic. Mid-tones like #BE90FF, #8D80FF, and #5B70FF provide smooth transitions and depth, ensuring versatility. This collection is perfect for designers aiming to capture a playful yet sophisticated retro-futuristic mood, ideal for vibrant branding, engaging web interfaces, or captivating digital illustrations that pulse with a distinct synth-pop rhythm.

Best used for

  • 80s retro-themed website designs
  • Synth-pop album art and promotional materials
  • Youthful and energetic brand identities
  • Interactive app interfaces and onboarding
  • Digital illustrations with a gradient feel
  • Social media graphics with a nostalgic touch

Suggested color roles

primary

Utilize #2E60FF as the dominant color for headlines, key interactive elements, or large graphic features to establish a bold, electric presence.

secondary

Employ #8D80FF for supporting visuals, subheadings, or background accents, providing a balanced mid-tone contrast.

accent

Reserve #F1A7F0 for subtle highlights, delicate text overlays, or glowing effects, offering a soft, ethereal touch.

background

Use #5B70FF as a primary background color for sections, offering a vibrant yet stable base that complements the other purples and blues.

text

For body text, use white for optimal legibility on darker blues and purples, or a dark charcoal/black for very light elements like #F1A7F0.

Accessibility notes

  • Ensure sufficient contrast for text, especially when pairing lighter colors like #F1A7F0 with similar pastel backgrounds.
  • The darker blues and purples (#5B70FF, #2E60FF) provide better contrast for white text, promoting readability.
  • Avoid using #F1A7F0 for extensive body text; it's better suited for accents or large, decorative elements.
  • Test contrast ratios for all interactive elements to ensure clear distinction and usability.

Recommended combinations

Synth Gradient

Ideal for creating smooth, flowing gradients in backgrounds or large UI components, transitioning from blue to light pink.

#2E60FF · #8D80FF · #F1A7F0

Pop Contrast

Excellent for layered elements or distinct sections, where the different shades of blue and purple provide clear visual separation.

#5B70FF · #BE90FF · #2E60FF

Retro Glow

Combine these for interactive elements or text highlights, creating a vibrant pop against a darker base.

#F1A7F0 · #8D80FF · #2E60FF

CSS variables

:root {
  --vaporwave-synth-pop-1: #F1A7F0;
  --vaporwave-synth-pop-2: #BE90FF;
  --vaporwave-synth-pop-3: #8D80FF;
  --vaporwave-synth-pop-4: #5B70FF;
  --vaporwave-synth-pop-5: #2E60FF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "vaporwave-synth-pop": {
        1: "#F1A7F0",
        2: "#BE90FF",
        3: "#8D80FF",
        4: "#5B70FF",
        5: "#2E60FF",
      }
    }
  }
}

Related searches

vaporwave purple bluesynth pop color schemeretro electric palette80s digital art colorsvibrant gradient aesthetic

Palette colors

Hex values

Color 1#F1A7F0
·
Color 2#BE90FF
·
Color 3#8D80FF
·
Color 4#5B70FF
·
Color 5#2E60FF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.7:1Fail
2.2:1Fail
2.7:1Fail
2
1.3:1Fail
1.3:1Fail
1.7:1Fail
2:1Fail
3
1.7:1Fail
1.3:1Fail
1.3:1Fail
1.6:1Fail
4
2.2:1Fail
1.7:1Fail
1.3:1Fail
1.2:1Fail
5
2.7:1Fail
2:1Fail
1.6:1Fail
1.2:1Fail

Similar palettes

More like Vaporwave Synth Pop

View all vibrant