Palette

Cyber City Haze

A bold, synthetic palette capturing the glow of futuristic city lights and digital interfaces.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cyber City Haze 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 Cyber City Haze.

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

Data visualization

#39FF14#FF00FF#00EEFF#7C00FF#E9FF5F

Palette guide

How to use Cyber City Haze

Overview

The Cyber City Haze palette is a bold, electrifying collection of neon hues, perfect for designs that demand attention and evoke a futuristic, high-energy vibe. Featuring the vivid green of #39FF14, the striking magenta of #FF00FF, and the brilliant cyan of #00EEFF, this palette screams digital innovation. #7C00FF adds a deep, mysterious purple, while #E9FF5F provides a sharp, almost acidic yellow-green accent. Designers can leverage these hex codes to create dynamic interfaces, eye-catching branding, or captivating digital art that pulses with synthetic energy. Developers will find these colors excellent for creating UI elements that truly pop.

Best used for

Gaming UI and streaming overlays
Electronic music album art and promotion
Futuristic event posters and branding
High-tech product launch campaigns
Dynamic digital advertisements
Creative coding and generative art

Suggested color roles

primary

#00EEFF - A vibrant, electric cyan, ideal for main brand elements, significant calls-to-action, or prominent UI features.

secondary

#FF00FF - A dazzling magenta, perfect for complementary sections, secondary navigation, or impactful graphic accents.

accent

#39FF14 - A bright, energetic neon green that provides a powerful, almost aggressive highlight for interactive elements or warnings.

background

#7C00FF - A deep, rich purple that offers a strong, dark base for the brighter neon colors to truly glow against.

text

#39FF14 - This neon green is excellent for headings or short, impactful text against dark backgrounds like #7C00FF. For body text, consider a crisp white or light gray.

Accessibility notes

Strictly ensure high contrast for all text, as many colors are extremely vibrant and can be difficult to read on each other.
Avoid using #FF00FF and #7C00FF for text on similar backgrounds, as their contrast might be insufficient.
The extreme brightness of #39FF14 and #E9FF5F requires very dark text (e.g., black) to be legible on them.
Exercise caution for color blind users; the strong reliance on hue differences may pose challenges for distinguishing elements.

Recommended combinations

Neon Circuit

A dark background with glowing cyan and green elements, suitable for tech interfaces or data displays.

#7C00FF · #00EEFF · #39FF14

Vibrant Glitch

Dynamic, high-energy compositions for hero sections or transition effects, mimicking digital distortion.

#FF00FF · #E9FF5F · #00EEFF

Electric Pulse

Bold, contrasting elements for calls-to-action, progress indicators, or striking graphical overlays.

#39FF14 · #FF00FF · #7C00FF

CSS variables

:root {
  --cyber-city-haze-1: #39FF14;
  --cyber-city-haze-2: #FF00FF;
  --cyber-city-haze-3: #00EEFF;
  --cyber-city-haze-4: #7C00FF;
  --cyber-city-haze-5: #E9FF5F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cyber-city-haze": {
        1: "#39FF14",
        2: "#FF00FF",
        3: "#00EEFF",
        4: "#7C00FF",
        5: "#E9FF5F",
      }
    }
  }
}

Hex values

Color 1#39FF14

Color 2#FF00FF

Color 3#00EEFF

Color 4#7C00FF

Color 5#E9FF5F

Accessibility

Contrast checker

2.3:1Fail

1.1:1Fail

4.7:1AA

1.2:1Fail

2.3:1Fail

2.2:1Fail

2:1Fail

2.8:1Fail

1.1:1Fail

2.2:1Fail

4.4:1AA18

1.3:1Fail

4.7:1AA

2:1Fail

4.4:1AA18

5.7:1AA

1.2:1Fail

2.8:1Fail

1.3:1Fail

5.7:1AA

Similar palettes

More like Cyber City Haze