Palette

Synthwave Glow Horizon

Bold neon pinks and electric blues collide, a throwback to the pulsating energy of 80s synthwave.

Vibrantretro5 colors

More Vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FF00FF#00FFFF#FF7F50#300090#1A0030

Palette guide

How to use Synthwave Glow Horizon

Overview

The Synthwave Glow Horizon palette is a bold throwback to the pulsating energy of 80s synthwave, where neon pinks and electric blues collide. It features the intense #FF00FF magenta and the brilliant #00FFFF cyan, complemented by a warm #FF7F50 coral. These vibrant hues are anchored by the deep purple tones of #300090 and #1A0030, creating a dramatic contrast that enhances the luminosity of the neons. This palette is ideal for designers and developers aiming to evoke a retro-futuristic landscape with a strong sense of depth and energetic glow. It's a striking choice for projects that demand visual impact and nostalgic appeal.

Best used for

Music festival branding and event visuals
Digital art and illustration with a neon theme
Retro game environments and character design
Web headers and interactive design elements
Motion graphics and animated sequences
Tech-focused marketing and advertising

Suggested color roles

primary

Utilize #1A0030 as a very deep purple, providing a stable and immersive base for backgrounds or foundational elements.

secondary

Employ #300090 as a rich indigo, adding atmospheric depth and a subtle transition to the brighter neons.

accent

Leverage #FF7F50 for vibrant coral pops, representing a warm glow or key interactive elements that need to stand out.

background

Apply #1A0030 as the primary background, creating a dark, intriguing canvas that enhances the luminosity of the brighter colors.

text

Use #00FFFF for electric blue text on dark backgrounds, or a crisp white or light gray for general body copy to ensure optimal readability.

Accessibility notes

Ensure #00FFFF and #FF7F50 have strong contrast against #1A0030 and #300090 for all text and UI elements (WCAG AA).
Avoid placing #FF00FF directly on #00FFFF for small text, as the low color difference can hinder readability.
For critical information, consider larger font sizes or bolder weights when using neon colors on darker backgrounds.
Always verify color contrast ratios with a WCAG compliance checker to meet accessibility standards.

Recommended combinations

Deep Horizon

A deep, gradient base transitioning to a vibrant magenta highlight for atmospheric backgrounds and energetic focus.

#1A0030 · #300090 · #FF00FF

Sunset Glow

Warm coral and electric cyan accents on a dark canvas, perfect for highlighting or creating a digital glow effect.

#FF7F50 · #00FFFF · #1A0030

Electric Echo

Layered neon effect, combining magenta, cyan, and indigo for dynamic graphic overlays and artistic compositions.

#FF00FF · #00FFFF · #300090

CSS variables

:root {
  --synthwave-glow-horizon-1: #FF00FF;
  --synthwave-glow-horizon-2: #00FFFF;
  --synthwave-glow-horizon-3: #FF7F50;
  --synthwave-glow-horizon-4: #300090;
  --synthwave-glow-horizon-5: #1A0030;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "synthwave-glow-horizon": {
        1: "#FF00FF",
        2: "#00FFFF",
        3: "#FF7F50",
        4: "#300090",
        5: "#1A0030",
      }
    }
  }
}

Hex values

Color 1#FF00FF

Color 2#00FFFF

Color 3#FF7F50

Color 4#300090

Color 5#1A0030

Accessibility

Contrast checker

2.5:1Fail

1.3:1Fail

4.4:1AA18

6.2:1AA

2.5:1Fail

2:1Fail

11:1AAA

15.4:1AAA

1.3:1Fail

2:1Fail

5.5:1AA

7.7:1AAA

4.4:1AA18

11:1AAA

5.5:1AA

1.4:1Fail

6.2:1AA

15.4:1AAA

7.7:1AAA

1.4:1Fail

Similar palettes

More like Synthwave Glow Horizon