Back to palettes

Palette

Neon Future Street

A high-contrast, glowing palette capturing the electric atmosphere of a rain-slicked cyberpunk street at night.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Neon Future Street 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 Future Street.

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

Data visualization

#00FFFF#FF00FF#FFFF00#0A0A0A#301934

Palette guide

How to use Neon Future Street

Overview

The Neon Future Street palette evokes the gritty, electric atmosphere of a rain-slicked cyberpunk street at night, blending intense neons with deep, shadowy tones. This high-contrast scheme features brilliant cyan (#00FFFF), vivid magenta (#FF00FF), and striking yellow (#FFFF00), set against profound darks like near-black (#0A0A0A) and a deep, muted purple (#301934). It's an unparalleled choice for designers and developers creating immersive sci-fi experiences, dark mode interfaces, or any project requiring a mysterious yet vibrant aesthetic. The interplay between glowing lights and deep shadows offers incredible visual drama and depth.

Best used for

  • Sci-fi movie posters and promotional art
  • Video game level design and environment art
  • Dark mode user interfaces and dashboards
  • Streaming channel overlays and branding
  • Concept art for futuristic settings
  • Cyberpunk-themed digital publications

Suggested color roles

primary

Use #00FFFF (Cyan) for main calls-to-action, critical notifications, or key visual highlights, simulating electric signs.

secondary

Apply #FF00FF (Magenta) for secondary interactive elements, progress bars, or to delineate different content sections.

accent

Incorporate #FFFF00 (Yellow) for warnings, special offers, or small, bright accents to simulate streetlights or hazard signs.

background

Utilize #0A0A0A (Near-Black) as the primary background for most content, or #301934 (Deep Purple) for atmospheric sections and textured overlays.

text

For body text, use white or a very light gray. Headings and important labels can use #00FFFF or #FF00FF for high visibility.

Accessibility notes

  • Ensure high contrast ratios for all text and interactive elements against the dark backgrounds, especially #0A0A0A.
  • Avoid using neon colors for extensive blocks of text; reserve them for headings, accents, or short, impactful phrases.
  • When combining multiple neon colors, verify sufficient luminance difference to prevent visual clutter or strain.
  • Consider providing a grayscale or muted color option for users who find highly saturated colors overwhelming.

Recommended combinations

Street Neon

Perfect for headers, banners, or interactive elements, mimicking bright street signs against the night.

#00FFFF · #FFFF00 · #0A0A0A

Dark Alley

Ideal for background sections, footers, or subtle graphical elements that need a moody, atmospheric depth.

#FF00FF · #301934 · #0A0A0A

Electric Rain

Excellent for hero sections, dynamic effects, or branding where primary neons need to pop vividly.

#00FFFF · #FF00FF · #0A0A0A

CSS variables

:root {
  --neon-future-street-1: #00FFFF;
  --neon-future-street-2: #FF00FF;
  --neon-future-street-3: #FFFF00;
  --neon-future-street-4: #0A0A0A;
  --neon-future-street-5: #301934;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "neon-future-street": {
        1: "#00FFFF",
        2: "#FF00FF",
        3: "#FFFF00",
        4: "#0A0A0A",
        5: "#301934",
      }
    }
  }
}

Related searches

cyberpunk street paletteneon sci-fi colorsdark electric themefuturistic night colorsvibrant film noir

Palette colors

Hex values

Color 1#00FFFF
·
Color 2#FF00FF
·
Color 3#FFFF00
·
Color 4#0A0A0A
·
Color 5#301934
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.5:1Fail
1.2:1Fail
15.8:1AAA
12.7:1AAA
2
2.5:1Fail
2.9:1Fail
6.3:1AA
5.1:1AA
3
1.2:1Fail
2.9:1Fail
18.4:1AAA
14.9:1AAA
4
15.8:1AAA
6.3:1AA
18.4:1AAA
1.2:1Fail
5
12.7:1AAA
5.1:1AA
14.9:1AAA
1.2:1Fail

Similar palettes

More like Neon Future Street

View all vibrant
Cyberpunk Alley Night
Cyberpunk Glitch Glow
Neon Alley Thrill
City Neon Jungle
Cyber Neon Glitch
Cyber Neon Pulse