Back to palettes

Palette

Urban Neon Glitch

Electrifying colors capturing the chaotic yet beautiful data stream of a futuristic, glowing city.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Urban Neon Glitch 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 Urban Neon Glitch.

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

Data visualization

#FF00FF#00FFFF#FFFF00#800080#20B2AA

Palette guide

How to use Urban Neon Glitch

Overview

The Urban Neon Glitch palette is an electrifying collection designed to evoke the chaotic beauty of digital data streams and futuristic cityscapes. It centers around the classic, high-intensity neon trio: #FF00FF (magenta), #00FFFF (cyan), and #FFFF00 (yellow). These vibrant hues are brilliantly complemented by the deep, rich #800080 (purple) and the unique #20B2AA (light sea green), adding depth and unexpected harmony to the glitch aesthetic. This palette is perfect for designers creating dynamic, edgy, and visually stunning projects that require a bold and modern digital feel, from interactive art to gaming interfaces.

Best used for

  • Gaming UI and VFX
  • Digital art installations
  • Cyberpunk themed content
  • Music video graphics
  • Event branding for tech conferences
  • Dynamic web backgrounds

Suggested color roles

primary

Use #00FFFF for primary interactive elements or key information, offering a bright and clear focal point.

secondary

Employ #FF00FF as a secondary accent for calls-to-action or to introduce a powerful, energetic contrast.

accent

Apply #FFFF00 for crucial highlights or warnings, ensuring maximum visibility due to its high luminosity.

background

Utilize #800080 for a deep, mysterious background, allowing the vibrant neons to pop dramatically.

text

For general text, white or a very light grey is recommended on #800080. For headlines, #00FFFF or #FF00FF work well.

Accessibility notes

  • The neon colors #FF00FF, #00FFFF, and #FFFF00 provide excellent contrast against #800080 for large text and UI elements.
  • Avoid using #20B2AA directly on #800080 for small text without checking WCAG contrast ratios, as it might be insufficient.
  • Ensure white or very light grey text is used on #800080 for optimal readability of body text.
  • Consider using #FFFF00 sparingly for text, primarily for alerts or small, impactful elements due to its high brightness.

Recommended combinations

Glitch Base

Ideal for a dark, mysterious base with vibrant, contrasting digital elements, perfect for UI.

#800080 · #00FFFF · #FF00FF

Unexpected Harmony

Use for secondary sections or graphic overlays, introducing a unique visual twist.

#800080 · #20B2AA · #FFFF00

Max Impact

Apply for headers, hero sections, or animated elements where maximum visual punch is required.

#FF00FF · #00FFFF · #FFFF00

CSS variables

:root {
  --urban-neon-glitch-1: #FF00FF;
  --urban-neon-glitch-2: #00FFFF;
  --urban-neon-glitch-3: #FFFF00;
  --urban-neon-glitch-4: #800080;
  --urban-neon-glitch-5: #20B2AA;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "urban-neon-glitch": {
        1: "#FF00FF",
        2: "#00FFFF",
        3: "#FFFF00",
        4: "#800080",
        5: "#20B2AA",
      }
    }
  }
}

Related searches

glitch art colorscyber aesthetic palettevibrant neon purpledigital chaos color schemeretro tech colors

Palette colors

Hex values

Color 1#FF00FF
·
Color 2#00FFFF
·
Color 3#FFFF00
·
Color 4#800080
·
Color 5#20B2AA
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.5:1Fail
2.9:1Fail
3:1AA18
1.2:1Fail
2
2.5:1Fail
1.2:1Fail
7.5:1AAA
2.1:1Fail
3
2.9:1Fail
1.2:1Fail
8.8:1AAA
2.4:1Fail
4
3:1AA18
7.5:1AAA
8.8:1AAA
3.6:1AA18
5
1.2:1Fail
2.1:1Fail
2.4:1Fail
3.6:1AA18

Similar palettes

More like Urban Neon Glitch

View all vibrant
Chroma Glitch Pop
Cybernetic Glitch Stream
Digital Glitch Matrix
Abstract Pop Glitch
Cyber Glitch Future
Cyber Grid Flash