Back to palettes

Palette

Cyberpunk Alley Light

Glimmers of electric pinks, blues, and greens cutting through the dark, gritty atmosphere of a futuristic alley.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FF00FF#00FFFF#00FF00#FFFF00#F8BBD0

Palette guide

How to use Cyberpunk Alley Light

Overview

The "Cyberpunk Alley Light" palette captures the vivid, artificial glow cutting through a gritty futuristic alley. This intensely vibrant collection features prominent neons such as #FF00FF (magenta), #00FFFF (cyan), #00FF00 (lime green), and #FFFF00 (bright yellow), creating an electrifying and energetic mood. The inclusion of #F8BBD0 (light pink) provides a slightly softer, almost ethereal contrast, adding an unexpected layer to the otherwise stark, high-tech aesthetic. Designers can leverage this palette for dynamic UI elements, eye-catching marketing materials, or immersive digital art. Developers will find these colors exceptional for creating interactive states, alerts, and visual cues that stand out with undeniable futuristic flair.

Best used for

  • Futuristic UI/UX design and game interfaces
  • Vibrant digital art and illustrations
  • Sci-fi themed event branding
  • Motion graphics and animated sequences
  • High-energy marketing campaigns
  • Neon-themed apparel design

Suggested color roles

primary

Utilize #00FFFF (Cyan) for main interactive elements, primary branding, or prominent headings.

secondary

Apply #FF00FF (Magenta) for secondary calls to action, important notifications, or dynamic accents.

accent

Employ #FFFF00 (Bright Yellow) for energetic highlights, warning indicators, or elements needing maximum pop.

background

While not explicitly dark, a deep charcoal or black (#000000) is recommended as a background to make these neons truly shine.

text

For optimal legibility on dark backgrounds, use white (#FFFFFF) or #F8BBD0. For headings, #00FFFF or #FF00FF can be very impactful.

Accessibility notes

  • Ensure substantial contrast when placing any neon color text on other bright neons or lighter backgrounds.
  • Avoid using #FFFF00 or #F8BBD0 for small body text; they are better suited for accents or larger display text.
  • The combination of multiple bright neons might be challenging for some forms of color blindness; test thoroughly.
  • Pair these vibrant colors with a very dark or black background for maximum readability and visual impact.

Recommended combinations

Electric Glare

Excellent for creating high-energy transitions, glowing effects, or multi-colored UI elements.

#FF00FF · #00FFFF · #00FF00

Cyber Glow

Ideal for softer neon gradients, ethereal lighting, or subtle futuristic background textures.

#FFFF00 · #00FFFF · #F8BBD0

Alley Haze

Perfect for abstract digital art, atmospheric effects, or creative brand elements with a unique twist.

#FF00FF · #F8BBD0 · #00FF00

CSS variables

:root {
  --cyberpunk-alley-light-1: #FF00FF;
  --cyberpunk-alley-light-2: #00FFFF;
  --cyberpunk-alley-light-3: #00FF00;
  --cyberpunk-alley-light-4: #FFFF00;
  --cyberpunk-alley-light-5: #F8BBD0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cyberpunk-alley-light": {
        1: "#FF00FF",
        2: "#00FFFF",
        3: "#00FF00",
        4: "#FFFF00",
        5: "#F8BBD0",
      }
    }
  }
}

Related searches

vibrant cyberpunk paletteneon city lights colorsbright futuristic designmagenta cyan yellow schemedigital alley aesthetic

Palette colors

Hex values

Color 1#FF00FF
·
Color 2#00FFFF
·
Color 3#00FF00
·
Color 4#FFFF00
·
Color 5#F8BBD0
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.5:1Fail
2.3:1Fail
2.9:1Fail
1.9:1Fail
2
2.5:1Fail
1.1:1Fail
1.2:1Fail
1.3:1Fail
3
2.3:1Fail
1.1:1Fail
1.3:1Fail
1.2:1Fail
4
2.9:1Fail
1.2:1Fail
1.3:1Fail
1.5:1Fail
5
1.9:1Fail
1.3:1Fail
1.2:1Fail
1.5:1Fail

Similar palettes

More like Cyberpunk Alley Light

View all vibrant
Electric City Neon
City Neon Pulse
Cyber Glow Synth
Cyberpunk Alley Neon
Cyberpunk Glitch Neon
Electric Metropolis Glow