Back to palettes

Palette

Neon Alley Chase

Electrifying colors capturing the dynamic energy and luminous glow of a futuristic city's back alleys at night.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Neon Alley Chase 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 Alley Chase.

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

Data visualization

#FF00FF#00FFFF#FFD700#ADFF2F#8A2BE2

Palette guide

How to use Neon Alley Chase

Overview

The 'Neon Alley Chase' palette is an electrifying collection of pure, intense neon hues, capturing the dynamic energy and luminous glow of a futuristic city's back alleys at night. With no dark base provided, it thrives on the high-octane interplay of #FF00FF (Vivid Magenta), #00FFFF (Electric Cyan), #FFD700 (Golden Yellow), #ADFF2F (Chartreuse Green), and #8A2BE2 (Bright Violet). This palette is designed for designers and developers who want to create extremely vivid, high-energy experiences, where every element demands attention and contributes to an overall sense of speed and excitement. A dark background is highly recommended for optimal impact.

Best used for

  • high-energy sports branding
  • youth-oriented digital campaigns
  • motion graphics and video effects
  • EDM concert visuals
  • futuristic game character design
  • app onboarding experiences

Suggested color roles

primary

Utilize #00FFFF (Electric Cyan) as a dominant, cool primary color for large graphical elements, main headlines, or interactive states, creating a strong digital presence.

secondary

Employ #FF00FF (Vivid Magenta) for powerful secondary elements, calls-to-action, or to create a vibrant, warm contrast against the cool cyan.

accent

Apply #ADFF2F (Chartreuse Green) sparingly for critical highlights, progress indicators, or to add a sharp, almost acidic visual pop.

background

To maximize impact, pair this palette with a deep charcoal or pure black background (e.g., #111111 or #000000), allowing the neons to truly glow.

text

For body text, use a crisp white or light gray against a dark background. For impactful headings or emphasized text, #00FFFF or #FF00FF can be used effectively on a dark base.

Accessibility notes

  • High contrast is crucial for all pairings; avoid using bright colors on bright backgrounds for text or critical information.
  • Ensure sufficient contrast when any of these bright colors are used as text against a recommended dark background.
  • Consider potential legibility issues for users with color vision deficiencies when #FF00FF and #8A2BE2 are used in close proximity.
  • Interactive elements should have clearly defined states (hover, active) with maximal contrast against their default appearance.

Recommended combinations

Dynamic Duo

A classic neon combination for main UI elements, banners, or section dividers, creating vibrant and clear separation.

#00FFFF · #FF00FF · #FFD700

Impactful CTA

Use for prominent call-to-action buttons or urgent alerts, leveraging the sharp contrast and high visibility.

#ADFF2F · #FF00FF · #00FFFF

Vibrant Overlay

Ideal for layered graphical elements, transparent overlays, or subtle gradients that add depth and shimmer to backgrounds.

#FFD700 · #8A2BE2 · #ADFF2F

CSS variables

:root {
  --neon-alley-chase-1: #FF00FF;
  --neon-alley-chase-2: #00FFFF;
  --neon-alley-chase-3: #FFD700;
  --neon-alley-chase-4: #ADFF2F;
  --neon-alley-chase-5: #8A2BE2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "neon-alley-chase": {
        1: "#FF00FF",
        2: "#00FFFF",
        3: "#FFD700",
        4: "#ADFF2F",
        5: "#8A2BE2",
      }
    }
  }
}

Related searches

bright neon paletteintense cyberpunk colorsenergetic UI designfuturistic vibrant themesynthwave chase colors

Palette colors

Hex values

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

Accessibility

Contrast checker

1
2
3
4
5
1
2.5:1Fail
2.2:1Fail
2.6:1Fail
1.9:1Fail
2
2.5:1Fail
1.1:1Fail
1:1Fail
4.8:1AA
3
2.2:1Fail
1.1:1Fail
1.1:1Fail
4.2:1AA18
4
2.6:1Fail
1:1Fail
1.1:1Fail
4.9:1AA
5
1.9:1Fail
4.8:1AA
4.2:1AA18
4.9:1AA

Similar palettes

More like Neon Alley Chase

View all vibrant