Back to palettes

Palette

Vibrant City Neon

An electrifying collection of bright, bold neon colors, mirroring the exhilarating energy of a bustling city at night.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Vibrant City Neon 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 Vibrant City Neon.

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

Data visualization

#FF00FF#00FFFF#FFFF00#FF0000#00FF00

Palette guide

How to use Vibrant City Neon

Overview

The "Vibrant City Neon" palette is an electrifying collection of bright, bold neon colors, mirroring the exhilarating energy of a bustling city at night. Featuring vivid Magenta (#FF00FF), luminous Cyan (#00FFFF), brilliant Yellow (#FFFF00), striking Red (#FF0000), and vibrant Green (#00FF00), this palette is designed for projects demanding a futuristic, high-tech, and energetic aesthetic. Designers can leverage these intense hues to create captivating digital art, dynamic event promotions, or cutting-edge UI designs. Developers will find these distinct hex codes perfect for consistent application in web animations, interactive elements, and dark-themed interfaces, ensuring a truly immersive and glowing user experience.

Best used for

  • Nightclub or concert promotions
  • Sci-fi themed game interfaces
  • Modern tech brand identity
  • Digital art and illustrations
  • Futuristic website designs
  • Event lighting and stage design

Suggested color roles

primary

#FF00FF provides a dominant, electrifying presence, ideal for main headings or key interactive elements.

secondary

#00FFFF offers a cool, high-tech contrast, suitable for background accents or secondary navigational features.

accent

#FFFF00 provides a sharp, energetic highlight, perfect for warnings, alerts, or small, attention-grabbing details.

background

A dark charcoal, black, or deep navy background is essential to make these neon colors truly pop and glow.

text

White or a very light grey text is recommended for legibility against the dark backgrounds, potentially using #FFFF00 for highlights.

Accessibility notes

  • High contrast is crucial; use these colors primarily on dark backgrounds.
  • Avoid placing #FF00FF on #FF0000 or #00FFFF on #00FF00 without significant contrast adjustment.
  • White text on any of these colors (on a dark background) will generally work, but always verify.
  • Use these bright colors sparingly for text, preferring them for larger headlines or UI elements.

Recommended combinations

Neon Glow

Excellent for creating vibrant gradients, futuristic UI elements, or striking banners on a dark theme.

#FF00FF · #00FFFF · #FFFF00

Electric Pulse

Ideal for dynamic animations, interactive buttons, or energetic graphic accents.

#FF0000 · #00FF00 · #FF00FF

Cyber Contrast

Effective for highlighting key information, data visualization, or creating a high-tech feel.

#00FFFF · #FFFF00 · #FF0000

CSS variables

:root {
  --vibrant-city-neon-1: #FF00FF;
  --vibrant-city-neon-2: #00FFFF;
  --vibrant-city-neon-3: #FFFF00;
  --vibrant-city-neon-4: #FF0000;
  --vibrant-city-neon-5: #00FF00;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "vibrant-city-neon": {
        1: "#FF00FF",
        2: "#00FFFF",
        3: "#FFFF00",
        4: "#FF0000",
        5: "#00FF00",
      }
    }
  }
}

Related searches

neon color schemecyberpunk palettevibrant dark mode colorscity lights designenergetic digital art colors

Palette colors

Hex values

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

Accessibility

Contrast checker

1
2
3
4
5
1
2.5:1Fail
2.9:1Fail
1.3:1Fail
2.3:1Fail
2
2.5:1Fail
1.2:1Fail
3.2:1AA18
1.1:1Fail
3
2.9:1Fail
1.2:1Fail
3.7:1AA18
1.3:1Fail
4
1.3:1Fail
3.2:1AA18
3.7:1AA18
2.9:1Fail
5
2.3:1Fail
1.1:1Fail
1.3:1Fail
2.9:1Fail

Similar palettes

More like Vibrant City Neon

View all vibrant
Electric Future Drive
Electric Metro Glow
Neon Alley Burst
Neon Urban Pulse
Urban Night Chroma
Abstract City Lights