Palette

Pixelated Arcade Flash

A jolt of electric brights, reminiscent of an 8-bit arcade game's vibrant, flashing screen.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Pixelated Arcade Flash 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 Pixelated Arcade Flash.

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

Data visualization

#FF0066#33FFCC#FFFF00#8A2BE2#00BFFF

Palette guide

How to use Pixelated Arcade Flash

Overview

The Pixelated Arcade Flash palette is an electric jolt of brights, capturing the vibrant, flashing screens of 8-bit arcade games. With dynamic hues like striking pink (#FF0066), energetic teal (#33FFCC), and brilliant yellow (#FFFF00), it's designed for impact. The deeper violet (#8A2BE2) and sky blue (#00BFFF) provide cool contrasts, making this palette versatile for energetic and playful designs. Developers and designers can harness these colors to create engaging user interfaces, lively branding, or visually stimulating digital experiences that evoke a sense of nostalgic fun.

Best used for

Mobile game interfaces and app design
Youth-oriented branding and marketing
Concert visuals and event promotions
Digital illustrations and character design
Playful social media graphics
Retro tech product aesthetics

Suggested color roles

primary

#FF0066 acts as a bold, engaging primary, drawing immediate attention to key features or calls to action.

secondary

#33FFCC offers a modern, refreshing contrast, excellent for supporting elements, progress bars, or secondary navigation.

accent

#FFFF00 is a high-visibility accent, ideal for alerts, interactive states, or small, critical details that must stand out.

background

A deep, mysterious base like #8A2BE2 or a dark charcoal can provide a strong foundation, allowing the brighter colors to pop.

text

For maximum readability, use #FFFF00 or #33FFCC for text on dark backgrounds. For lighter backgrounds, a dark gray or black is most effective.

Accessibility notes

Ensure sufficient contrast between text and background, especially when using vibrant colors. #FFFF00 offers good contrast on #8A2BE2.
Avoid pairing #FF0066 and #8A2BE2 for small text due to potential readability issues.
Consider using larger font sizes or bolding for text elements in these bright hues to improve legibility.
Always test color combinations against WCAG contrast guidelines for interactive elements and crucial information.

Recommended combinations

Electric Pop

A dynamic and playful combination perfect for high-energy interactive elements, game highlights, or vibrant calls to action.

#FF0066 · #33FFCC · #FFFF00

Vaporwave Cool

Creates a cool, ethereal retro vibe, suitable for immersive backgrounds, transition screens, or stylized branding.

#8A2BE2 · #00BFFF · #FF0066

Game Alert

An urgent and highly visible combination, ideal for warnings, notifications, or critical user feedback in a game setting.

#FFFF00 · #FF0066 · #33FFCC

CSS variables

:root {
  --pixelated-arcade-flash-1: #FF0066;
  --pixelated-arcade-flash-2: #33FFCC;
  --pixelated-arcade-flash-3: #FFFF00;
  --pixelated-arcade-flash-4: #8A2BE2;
  --pixelated-arcade-flash-5: #00BFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "pixelated-arcade-flash": {
        1: "#FF0066",
        2: "#33FFCC",
        3: "#FFFF00",
        4: "#8A2BE2",
        5: "#00BFFF",
      }
    }
  }
}

Hex values

Color 1#FF0066

Color 2#33FFCC

Color 3#FFFF00

Color 4#8A2BE2

Color 5#00BFFF

Accessibility

Contrast checker

3:1Fail

3.6:1AA18

1.5:1Fail

1.8:1Fail

3:1Fail

1.2:1Fail

4.6:1AA

1.6:1Fail

3.6:1AA18

1.2:1Fail

5.5:1AA

2:1Fail

1.5:1Fail

4.6:1AA

5.5:1AA

2.8:1Fail

1.8:1Fail

1.6:1Fail

2:1Fail

2.8:1Fail

Similar palettes

More like Pixelated Arcade Flash