Back to palettes

Palette

Retro Arcade Neon

A vivid splash of electrifying colors reminiscent of a classic 8-bit arcade game.

VibrantEnergetic5 colors
More Vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FF00FF#00FFFF#FFD700#00FF00#8A2BE2

Palette guide

How to use Retro Arcade Neon

Overview

The Retro Arcade Neon palette offers a vivid splash of electrifying colors, reminiscent of a classic 8-bit arcade game. This energetic collection features a bold magenta (#FF00FF), brilliant cyan (#00FFFF), shimmering golden yellow (#FFD700), vibrant lime green (#00FF00), and a rich blue-violet (#8A2BE2). It's designed to evoke a playful, cyberpunk, and distinctly retro mood, making it perfect for projects that demand high visual impact and a sense of digital adventure. Designers can leverage these intense hues to create dynamic interfaces, captivating illustrations, and memorable branding.

Best used for

  • Interactive game demos
  • Sci-fi themed digital art
  • Event promotion for tech conferences
  • Youth-oriented educational platforms
  • App and software loading screens
  • Fashion accessories with a retro edge

Suggested color roles

primary

Use #FF00FF (Magenta) for striking calls-to-action, prominent headlines, or key interactive elements.

secondary

Employ #00FFFF (Cyan) to provide a cool, refreshing contrast, suitable for secondary navigation or background details.

accent

Utilize #FFD700 (Golden Yellow) for small, bright highlights, notifications, or progress indicators.

background

Leverage #8A2BE2 (Blue Violet) as a deep, atmospheric base that allows the neon hues to truly glow and create depth.

text

For dark backgrounds like #8A2BE2, use #FFD700 for headings, or a clean white for body text. On lighter elements, a dark charcoal or black provides optimal contrast.

Accessibility notes

  • Ensure strong contrast between neon colors and backgrounds; #FFD700 on #8A2BE2 is a good combination.
  • Avoid using #00FF00 for small text on #FFD700, as it may lack sufficient contrast.
  • Consider using larger font sizes and bold weights for text rendered in bright neon colors to aid readability.
  • Use white or very light grey for extensive body text on dark backgrounds to maintain legibility.

Recommended combinations

Cyber Glow

Creates a deep, futuristic backdrop with glowing magenta and cyan elements.

#8A2BE2 · #FF00FF · #00FFFF

Power Grid

Ideal for UI elements indicating power, status, or interactive zones.

#00FF00 · #FFD700 · #FF00FF

Retro Wave

Perfect for gradients or layered effects in synthwave-inspired graphics and animations.

#00FFFF · #FF00FF · #8A2BE2

CSS variables

:root {
  --retro-arcade-neon-3-1: #FF00FF;
  --retro-arcade-neon-3-2: #00FFFF;
  --retro-arcade-neon-3-3: #FFD700;
  --retro-arcade-neon-3-4: #00FF00;
  --retro-arcade-neon-3-5: #8A2BE2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-arcade-neon-3": {
        1: "#FF00FF",
        2: "#00FFFF",
        3: "#FFD700",
        4: "#00FF00",
        5: "#8A2BE2",
      }
    }
  }
}

Related searches

cyberpunk color schemesvibrant 8-bit paletteneon game UI colorsplayful retro designelectric digital aesthetic

Palette colors

Hex values

Color 1#FF00FF
·
Color 2#00FFFF
·
Color 3#FFD700
·
Color 4#00FF00
·
Color 5#8A2BE2
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.5:1Fail
2.2:1Fail
2.3:1Fail
1.9:1Fail
2
2.5:1Fail
1.1:1Fail
1.1:1Fail
4.8:1AA
3
2.2:1Fail
1.1:1Fail
1:1Fail
4.2:1AA18
4
2.3:1Fail
1.1:1Fail
1:1Fail
4.3:1AA18
5
1.9:1Fail
4.8:1AA
4.2:1AA18
4.3:1AA18

Similar palettes

More like Retro Arcade Neon

View all Vibrant