Back to palettes

Palette

Neon Alley Surge

Electrifying urban nightscape pulses with vibrant, artificial lights in a shadowy alley.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0B0B0B#FF00FF#00FFFF#FFFF00#3333FF

Palette guide

How to use Neon Alley Surge

Overview

The "Neon Alley Surge" palette is a potent blend of stark darkness and electrifying neons, designed to capture the raw energy of a futuristic urban nightscape. It features an almost absolute black (#0B0B0B), intense magenta (#FF00FF), brilliant cyan (#00FFFF), dazzling yellow (#FFFF00), and a vibrant electric blue (#3333FF). This palette is a go-to for designers and developers aiming for a high-contrast, cyberpunk, or tech-noir aesthetic. These hex codes are perfectly suited for creating impactful UI elements, immersive digital environments, and branding that demands attention with its dramatic interplay of light and shadow.

Best used for

  • Cyberpunk game interfaces and cinematics
  • Dark mode UI for tech applications
  • Esports branding and streaming overlays
  • Digital art with a stark, futuristic edge
  • Music event visuals (EDM, industrial)
  • High-contrast website designs

Suggested color roles

primary

#0B0B0B (Almost Absolute Black) - The foundational background, providing maximum contrast for the glowing neons.

secondary

#3333FF (Vibrant Electric Blue) - Excellent for secondary sections, large interactive elements, or subtle atmospheric lighting.

accent

#FFFF00 (Dazzling Yellow) - Reserve for critical alerts, small icons, or to draw immediate attention to key information.

background

#0B0B0B (Almost Absolute Black) - The dominant backdrop, allowing the intense neon colors to radiate.

text

#00FFFF (Brilliant Cyan) or white - For headings and prominent text against the dark background; a very light gray for body copy for readability.

Accessibility notes

  • Ensure text in #FF00FF, #00FFFF, #FFFF00, or #3333FF has sufficient contrast against the #0B0B0B background.
  • Avoid placing #3333FF (Electric Blue) directly on #FF00FF (Magenta) for text due to potential low contrast and visual vibration.
  • Always test color combinations for WCAG AA compliance, especially for text and interactive elements.
  • Be mindful of color-blind users when relying solely on different neon hues to convey distinct information.

Recommended combinations

Dark Cyber-Pop

Ideal for dark mode UI, where magenta and cyan provide primary interactive highlights.

#0B0B0B · #FF00FF · #00FFFF

Electric Alley

Use for dynamic visual effects, loading screens, or energetic header sections.

#3333FF · #FFFF00 · #FF00FF

Neon Contrast

A striking combination for information panels or call-to-action buttons, ensuring high visibility.

#0B0B0B · #3333FF · #FFFF00

CSS variables

:root {
  --neon-alley-surge-1: #0B0B0B;
  --neon-alley-surge-2: #FF00FF;
  --neon-alley-surge-3: #00FFFF;
  --neon-alley-surge-4: #FFFF00;
  --neon-alley-surge-5: #3333FF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "neon-alley-surge": {
        1: "#0B0B0B",
        2: "#FF00FF",
        3: "#00FFFF",
        4: "#FFFF00",
        5: "#3333FF",
      }
    }
  }
}

Related searches

dark cyberpunk color schemeneon black paletteelectric blue magentahigh contrast digital designfuturistic UI colors

Palette colors

Hex values

Color 1#0B0B0B
·
Color 2#FF00FF
·
Color 3#00FFFF
·
Color 4#FFFF00
·
Color 5#3333FF
·

Accessibility

Contrast checker

1
2
3
4
5
1
6.3:1AA
15.7:1AAA
18.3:1AAA
2.9:1Fail
2
6.3:1AA
2.5:1Fail
2.9:1Fail
2.2:1Fail
3
15.7:1AAA
2.5:1Fail
1.2:1Fail
5.5:1AA
4
18.3:1AAA
2.9:1Fail
1.2:1Fail
6.4:1AA
5
2.9:1Fail
2.2:1Fail
5.5:1AA
6.4:1AA

Similar palettes

More like Neon Alley Surge

View all vibrant
Celestial Aurora Burst
City Lights Energy
Cyber Glitch Future
Cybernetic City Grid
Cybernetic Gridscape
Cyberpunk City Lights