Back to palettes

Palette

80s Arcade Glow

A vivid and electric palette inspired by classic 80s arcade games and synthwave aesthetics.

vibrantretro5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FF006E#FFDD00#3CFF3C#00CFFF#001F5C

Palette guide

How to use 80s Arcade Glow

Overview

80s Arcade Glow is a high-energy neon color palette for interfaces that need instant retro impact. The hot pink, electric yellow, acid green, and cyan create a bright arcade-cabinet feel, while the deep navy gives the palette a necessary anchor for backgrounds, panels, and text-heavy areas. Use it when you want a product page, game UI, event poster, music landing page, or interactive dashboard to feel loud, nostalgic, and digital without losing structure.

Best used for

  • Retro game interfaces and arcade-inspired web apps
  • Synthwave landing pages, hero sections, and event promos
  • Music, nightlife, esports, and creator portfolio branding
  • Buttons, badges, progress states, charts, and notification accents
  • Dark UI compositions that need vivid neon highlights

Suggested color roles

primary

Use #FF006E as the main brand accent for high-emphasis buttons, active states, and hero callouts.

secondary

Use #00CFFF for links, secondary actions, focus states, and cooler interactive highlights.

accent

Use #FFDD00 and #3CFF3C sparingly for badges, chart highlights, success states, and attention-grabbing details.

background

Use #001F5C as a dark background or panel color to make the neon colors feel intentional instead of overwhelming.

text

Use white or near-white text on the navy background, and reserve dark text for the yellow and green swatches.

Accessibility notes

  • The neon accent colors are strongest when paired with the deep navy background rather than white.
  • Avoid using hot pink, yellow, green, and cyan together as body text colors; they work better as accents and states.
  • Check contrast before placing white text on #FFDD00 or #3CFF3C, because bright colors often need dark text for readability.
  • For calmer layouts, use #001F5C for most surfaces and introduce only one or two neon accents per section.

Recommended combinations

Arcade Hero

A strong combination for full-screen hero sections, game menus, and campaign headers.

#001F5C · #FF006E · #00CFFF

High Score Accent

Useful for stat cards, progress bars, success messages, and achievement badges.

#FFDD00 · #3CFF3C · #001F5C

Synthwave Action

Best for buttons, links, and interactive UI elements where every state should feel energetic.

#FF006E · #00CFFF · #FFDD00

CSS variables

:root {
  --80s-arcade-glow-1: #FF006E;
  --80s-arcade-glow-2: #FFDD00;
  --80s-arcade-glow-3: #3CFF3C;
  --80s-arcade-glow-4: #00CFFF;
  --80s-arcade-glow-5: #001F5C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "80s-arcade-glow": {
        1: "#FF006E",
        2: "#FFDD00",
        3: "#3CFF3C",
        4: "#00CFFF",
        5: "#001F5C",
      }
    }
  }
}

Related searches

80s arcade color paletteretro neon color palettesynthwave UI colorselectric pink and cyan palettearcade game hex colors

Palette colors

Hex values

Color 1#FF006E
·
Color 2#FFDD00
·
Color 3#3CFF3C
·
Color 4#00CFFF
·
Color 5#001F5C
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.8:1Fail
2.8:1Fail
2.1:1Fail
4.1:1AA18
2
2.8:1Fail
1:1Fail
1.4:1Fail
11.5:1AAA
3
2.8:1Fail
1:1Fail
1.4:1Fail
11.5:1AAA
4
2.1:1Fail
1.4:1Fail
1.4:1Fail
8.4:1AAA
5
4.1:1AA18
11.5:1AAA
11.5:1AAA
8.4:1AAA

Similar palettes

More like 80s Arcade Glow

View all vibrant
Neon Synthwave Pulse
Neon Vapor Wave
Retro Arcade
Retro Arcade Glow
Retro Synthwave Pulse
Synthwave Dusk