Palette

Cyberpunk Alley Glow

A vivid and striking palette inspired by the dazzling, high-contrast neons of a futuristic metropolis.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cyberpunk Alley Glow 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 Cyberpunk Alley Glow.

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

Data visualization

#FF00A6#00C9FF#333333#8A2BE2#C0C0C0

Palette guide

How to use Cyberpunk Alley Glow

Overview

The "Cyberpunk Alley Glow" palette vividly captures the dazzling neons of a futuristic metropolis, perfect for designs demanding high-contrast and energetic visuals. This striking collection features intense #FF00A6 (electric fuchsia) and brilliant #00C9FF (sky blue), which pop against the palette's grounding darks. Deeper tones like #333333 (charcoal) and #8A2BE2 (blue violet) provide essential depth, while #C0C0C0 (silver) offers a metallic touch. Designers can harness these colors for dynamic UI elements, immersive game environments, or edgy branding that evokes a sense of urban futurism. Developers will find these hues effective for creating distinct visual hierarchies and engaging interactive experiences, ensuring elements like alerts and calls-to-action are impossible to miss and contribute to a truly immersive user journey.

Best used for

Futuristic app interfaces and dashboards
Game UI and environment lighting
Music festival or rave promotion materials
Digital art and character highlights
High-tech product branding
Motion graphics and title sequences

Suggested color roles

primary

Utilize #00C9FF (Sky Blue) for main navigation, active states, or prominent branding elements to establish a clear focal point.

secondary

Apply #FF00A6 (Electric Fuchsia) for secondary calls to action, important notifications, or vibrant accents that demand attention.

accent

Employ #8A2BE2 (Blue Violet) for subtle glows, interactive highlights, or secondary data visualization that adds depth.

background

Use #333333 (Charcoal) as a deep, stable foundation that makes the neon colors intensely vibrant and visually striking.

text

For optimal legibility on dark backgrounds, use #C0C0C0 (Silver) for general body text or pure white (#FFFFFF) for headings and key information.

Accessibility notes

Ensure sufficient contrast when using #C0C0C0 text on #333333 background, especially for smaller font sizes.
Avoid using #FF00A6 or #00C9FF directly for large blocks of body text; they are better suited for accents or headings.
Test combinations like #FF00A6 on #8A2BE2 for color blindness compatibility to ensure broad accessibility.
Reserve the bright neons for interactive elements or key information to prevent visual fatigue and maintain focus.

Recommended combinations

Neon Pulse

Excellent for creating vibrant UI contrasts, glowing button states, or energetic data displays in a digital interface.

#FF00A6 · #00C9FF · #333333

Urban Shadow

Ideal for background gradients, subtle metallic textures, or secondary informational panels requiring depth.

#333333 · #8A2BE2 · #C0C0C0

Electric Edge

Perfect for highlighting key features, progress indicators, or striking graphic elements that need to pop.

#00C9FF · #FF00A6 · #C0C0C0

CSS variables

:root {
  --cyberpunk-alley-glow-2-1: #FF00A6;
  --cyberpunk-alley-glow-2-2: #00C9FF;
  --cyberpunk-alley-glow-2-3: #333333;
  --cyberpunk-alley-glow-2-4: #8A2BE2;
  --cyberpunk-alley-glow-2-5: #C0C0C0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cyberpunk-alley-glow-2": {
        1: "#FF00A6",
        2: "#00C9FF",
        3: "#333333",
        4: "#8A2BE2",
        5: "#C0C0C0",
      }
    }
  }
}

Hex values

Color 1#FF00A6

Color 2#00C9FF

Color 3#333333

Color 4#8A2BE2

Color 5#C0C0C0

Accessibility

Contrast checker

1.9:1Fail

3.5:1AA18

1.6:1Fail

2:1Fail

1.9:1Fail

6.5:1AA

3.1:1AA18

1.1:1Fail

3.5:1AA18

6.5:1AA

2.1:1Fail

6.9:1AA

1.6:1Fail

3.1:1AA18

2.1:1Fail

3.3:1AA18

2:1Fail

1.1:1Fail

6.9:1AA

3.3:1AA18

Similar palettes

More like Cyberpunk Alley Glow

View all vibrant

Cyber Neon Pulse

Cyber Orchid Glow

Cybernetic Pulse Beat

Cyberpunk Alley Night

Electric Future Drive

Neo Tokyo Pulse