Palette

Retro Arcade Glow

Electrifying neons ignite, recreating the nostalgic, high-energy atmosphere of an 8-bit arcade.

vibrantretro5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FF00FF#00FFFF#FFFF00#FF4500#8A2BE2

Palette guide

How to use Retro Arcade Glow

Overview

The Retro Arcade Glow palette delivers an electrifying blast from the past, perfect for projects demanding vibrant, nostalgic energy. Featuring dazzling neons like electric magenta (#FF00FF), luminous cyan (#00FFFF), and bright yellow (#FFFF00), this collection is ideal for capturing the essence of classic 8-bit gaming and synthwave aesthetics. Designers can leverage the bold orange-red (#FF4500) and deep violet (#8A2BE2) to create dynamic contrasts and eye-catching UI elements. This palette is a go-to for evoking a playful, high-energy retro mood, ensuring designs pop with undeniable visual appeal and a sense of digital adventure.

Best used for

Retro game UI/UX design
Event branding for 80s/90s themed parties
Streaming overlays and content creation
Digital art and illustration with a cyberpunk feel
Interactive exhibits or virtual reality experiences
Apparel and merchandise designs

Suggested color roles

primary

Use #FF00FF (Electric Magenta) for main calls-to-action, key headings, or dominant graphic elements to command attention.

secondary

Employ #00FFFF (Luminous Cyan) for secondary buttons, active states, or background accents, providing a cool contrast to magenta.

accent

Reserve #FFFF00 (Bright Yellow) for small, impactful highlights, notifications, or interactive elements that require maximum visibility.

background

Utilize #8A2BE2 (Deep Violet) as a rich, dark base that allows the neon colors to truly glow and stand out.

text

For dark backgrounds like #8A2BE2, use #FFFF00 for headings, or white for body text. For light areas, use a dark charcoal.

Accessibility notes

Ensure sufficient contrast between neon colors and backgrounds; #FFFF00 on #8A2BE2 has good contrast.
Avoid using multiple bright neons for body text, as readability can be severely impacted.
Pair #FF00FF or #00FFFF with a very dark background or white text for better legibility.
Use bold weights or larger font sizes for text rendered in neon colors, especially for headlines.

Recommended combinations

Neon Pop

Ideal for striking UI elements where magenta and cyan pop against a deep violet background.

#FF00FF · #00FFFF · #8A2BE2

Arcade Flash

Creates energetic alerts or highlight sections, mimicking classic arcade lights.

#FFFF00 · #FF4500 · #00FFFF

Vaporwave Gradient

Perfect for gradients or layered effects, capturing a synthwave aesthetic with smooth transitions.

#FF00FF · #8A2BE2 · #00FFFF

CSS variables

:root {
  --retro-arcade-glow-1: #FF00FF;
  --retro-arcade-glow-2: #00FFFF;
  --retro-arcade-glow-3: #FFFF00;
  --retro-arcade-glow-4: #FF4500;
  --retro-arcade-glow-5: #8A2BE2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-arcade-glow": {
        1: "#FF00FF",
        2: "#00FFFF",
        3: "#FFFF00",
        4: "#FF4500",
        5: "#8A2BE2",
      }
    }
  }
}

Hex values

Color 1#FF00FF

Color 2#00FFFF

Color 3#FFFF00

Color 4#FF4500

Color 5#8A2BE2

Accessibility

Contrast checker

2.5:1Fail

2.9:1Fail

1.1:1Fail

1.9:1Fail

2.5:1Fail

1.2:1Fail

2.7:1Fail

4.8:1AA

2.9:1Fail

1.2:1Fail

3.2:1AA18

5.5:1AA

1.1:1Fail

2.7:1Fail

3.2:1AA18

1.7:1Fail

1.9:1Fail

4.8:1AA

5.5:1AA

1.7:1Fail

Similar palettes

More like Retro Arcade Glow

Synthwave Sunset Drive

Arcade Neon Dreams

Electric Synthwave Drive