Palette

Neon Arcade Buzz

An electrifying blend of bright neons and primary colors, reminiscent of an old arcade's vibrant buzz.

VibrantRetro5 colors

More Vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#E040FB#FFEB3B#3F51B5#F44336#00BCD4

Palette guide

How to use Neon Arcade Buzz

Overview

The Neon Arcade Buzz palette offers an electrifying blend of bright neons and primary colors, reminiscent of an old arcade's vibrant buzz. Featuring lively #E040FB (Vibrant Purple), sunny #FFEB3B (Arcade Yellow), deep #3F51B5 (Indigo Blue), bold #F44336 (Bright Red), and refreshing #00BCD4 (Teal Blue), this collection is perfect for infusing projects with playful energy and nostalgic charm. Designers and developers can leverage these vivid yet slightly tempered hues to create engaging user interfaces, dynamic branding, or any visual content that aims to evoke a retro-modern feel. Its balanced intensity ensures both impact and a degree of versatility.

Best used for

Retro gaming and entertainment app UIs
Educational content for children (color theory)
Playful branding for youth-oriented products
Infographic design requiring clear color separation
Event promotions with a retro-futuristic theme
Digital art with a focus on vibrant, clean colors

Suggested color roles

primary

Use #E040FB (Vibrant Purple) or #3F51B5 (Indigo Blue) as a dominant color for backgrounds or large graphical elements to set a deep, engaging tone.

secondary

Employ #FFEB3B (Arcade Yellow) for secondary navigation, highlights, or key information to draw the eye with its bright, cheerful presence.

accent

Apply #F44336 (Bright Red) sparingly for call-to-action buttons, alerts, or small, impactful details, ensuring maximum visibility and urgency.

background

A deep charcoal or dark grey background is highly recommended to make these colors pop and achieve optimal contrast for readability.

text

For primary text, use white or a very light grey on dark backgrounds. For headings or emphasis, #00BCD4 (Teal Blue) can provide a rich, legible contrast on lighter elements or as a subtle glow on darks.

Accessibility notes

Ensure high contrast ratios for text and interactive elements, especially when pairing bright colors, to meet accessibility standards.
Avoid using two highly saturated colors together for text and background without careful contrast checking, as it can cause significant eye strain.
Test readability across different screen types and lighting conditions, as vibrant colors can vary in appearance.
For critical information, avoid relying solely on color; incorporate icons or text labels for better accessibility, particularly for colorblind users.

Recommended combinations

Arcade Pop

Creates a classic, primary-focused arcade feel, great for game elements or playful branding.

#F44336 · #FFEB3B · #00BCD4

Retro Glow

Ideal for a nostalgic, glowing background effect, combining cool tones with a bright accent.

#E040FB · #3F51B5 · #FFEB3B

Energetic Buzz

Excellent for alerts, interactive elements, or vibrant charts, offering clear distinction and energy.

#FFEB3B · #F44336 · #00BCD4

CSS variables

:root {
  --neon-arcade-buzz-3-1: #E040FB;
  --neon-arcade-buzz-3-2: #FFEB3B;
  --neon-arcade-buzz-3-3: #3F51B5;
  --neon-arcade-buzz-3-4: #F44336;
  --neon-arcade-buzz-3-5: #00BCD4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "neon-arcade-buzz-3": {
        1: "#E040FB",
        2: "#FFEB3B",
        3: "#3F51B5",
        4: "#F44336",
        5: "#00BCD4",
      }
    }
  }
}

Hex values

Color 1#E040FB

Color 2#FFEB3B

Color 3#3F51B5

Color 4#F44336

Color 5#00BCD4

Accessibility

Contrast checker

2.7:1Fail

2.1:1Fail

1.1:1Fail

1.5:1Fail

2.7:1Fail

5.6:1AA

3:1AA18

1.9:1Fail

2.1:1Fail

5.6:1AA

1.9:1Fail

3:1Fail

1.1:1Fail

3:1AA18

1.9:1Fail

1.6:1Fail

1.5:1Fail

1.9:1Fail

3:1Fail

1.6:1Fail

Similar palettes

More like Neon Arcade Buzz

Neon Arcade Buzz

See it in context.

Ready when you are.

Built with Neon Arcade Buzz.

How to use Neon Arcade Buzz

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Arcade Pop

Retro Glow

Energetic Buzz

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Neon Arcade Buzz