Palette

Electric Arcade Pop

Bright, glowing neons and electric colors that spark the excitement and playful energy of classic arcade games.

vibrantplayful5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Electric Arcade 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 Electric Arcade Pop.

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

Data visualization

#FF00FF#00FFFF#FFFF00#FF6600#3300CC

Palette guide

How to use Electric Arcade Pop

Overview

The "Electric Arcade Pop" palette explodes with bright, glowing neons and electric colors, perfectly capturing the playful, high-energy vibe of classic arcade games. It features intense Magenta (#FF00FF), Cyan (#00FFFF), and Yellow (#FFFF00), combined with a vibrant Orange (#FF6600) and a deep Electric Blue (#3300CC). This collection is a dream for designers aiming to evoke retro-futuristic fun, pop culture, or dynamic digital experiences. Developers can harness these vivid hues to create engaging, nostalgic, and interactive user interfaces that pop with personality and excitement.

Best used for

Retro arcade game interfaces or marketing
Children's entertainment apps or websites
Pop art-inspired graphic design
Music video or party promotion materials
Toy or novelty product branding
Interactive educational platforms for youth

Suggested color roles

primary

#FF00FF (Magenta) - Use for main calls-to-action, prominent headings, or interactive elements to create an immediate, playful impact.

secondary

#00FFFF (Cyan) - Ideal for subheadings, secondary buttons, or background gradients that need a cool, digital glow.

accent

#FF6600 (Vibrant Orange) - Perfect for highlighting critical information, small icons, or to add an extra jolt of energy and warmth.

background

#3300CC (Electric Blue) - A deep, saturated background that allows the vibrant neons to truly pop and simulate glowing effects.

text

#FFFF00 (Yellow) - Provides excellent visibility for text on darker backgrounds like #3300CC, embodying the arcade aesthetic. Pure white can also be used.

Accessibility notes

Many of these vibrant colors can have low contrast with each other; test all text/background combinations.
Ensure #FFFF00 text on #3300CC background meets WCAG contrast standards.
Avoid using #FF00FF or #00FFFF for small body text due to their intense saturation.
Use the deepest color, #3300CC, as the background for most text to maximize readability against the neon.

Recommended combinations

Arcade Blast

A deep blue background with bright yellow text and magenta accents, evoking classic arcade screens.

#3300CC · #FFFF00 · #FF00FF

Pop Energy

Cyan and orange elements against a dark blue, great for interactive buttons or progress bars.

#00FFFF · #FF6600 · #3300CC

Retro Glow

Magenta and yellow highlights on a cyan base, suitable for animated effects or playful banners.

#FF00FF · #FFFF00 · #00FFFF

CSS variables

:root {
  --electric-arcade-pop-1: #FF00FF;
  --electric-arcade-pop-2: #00FFFF;
  --electric-arcade-pop-3: #FFFF00;
  --electric-arcade-pop-4: #FF6600;
  --electric-arcade-pop-5: #3300CC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "electric-arcade-pop": {
        1: "#FF00FF",
        2: "#00FFFF",
        3: "#FFFF00",
        4: "#FF6600",
        5: "#3300CC",
      }
    }
  }
}

Hex values

Color 1#FF00FF

Color 2#00FFFF

Color 3#FFFF00

Color 4#FF6600

Color 5#3300CC

Accessibility

Contrast checker

2.5:1Fail

2.9:1Fail

1.1:1Fail

3.3:1AA18

2.5:1Fail

1.2:1Fail

2.3:1Fail

8.3:1AAA

2.9:1Fail

1.2:1Fail

2.7:1Fail

9.7:1AAA

1.1:1Fail

2.3:1Fail

2.7:1Fail

3.6:1AA18

3.3:1AA18

8.3:1AAA

9.7:1AAA

3.6:1AA18

Similar palettes

More like Electric Arcade Pop