Palette

Cyber Glow Graffiti

An electrifying palette capturing the vibrant, high-contrast energy of a futuristic city at night, full of neon lights.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cyber Glow Graffiti 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 Glow Graffiti.

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

Data visualization

#FF007F#00FFFF#6A057F#2E2E2E#F0F0F0

Palette guide

How to use Cyber Glow Graffiti

Overview

The Cyber Glow Graffiti palette is an electrifying mix, capturing the vibrant, high-contrast energy of a futuristic city at night, full of neon lights. Featuring the vivid #FF007F, the dazzling #00FFFF, and the deep #6A057F, this palette balances starkness with brilliant glow. #2E2E2E provides a near-black base, while #F0F0F0 offers a crisp, near-white for ultimate contrast. Designers can leverage these hex codes to create dynamic interfaces, striking branding, or captivating digital art that pulses with synthetic, urban energy. Developers will find these colors excellent for crafting UI elements that pop and command attention in dark mode applications.

Best used for

Cyberpunk game interfaces and environments
Urban streetwear branding and fashion design
Electronic music event promotion and album art
Digital art with a neon city theme
Interactive web experiences with dark modes
Graffiti-inspired digital art and illustrations

Suggested color roles

primary

#00FFFF - A brilliant, energetic cyan, ideal for main brand elements, significant calls-to-action, or prominent UI features.

secondary

#FF007F - A dazzling, hot pink/magenta, perfect for complementary sections, secondary navigation, or impactful graphic accents.

accent

#6A057F - A deep, mysterious purple, providing a subtle yet powerful contrast for depth or structural elements.

background

#2E2E2E - A dark, almost black charcoal gray, creating a sophisticated and immersive base for all other elements.

text

#F0F0F0 - A crisp, near-white that offers excellent readability for all text against the darkest backgrounds like #2E2E2E.

Accessibility notes

Ensure #F0F0F0 text on #2E2E2E or #6A057F backgrounds meets WCAG AA contrast requirements.
The vibrant #FF007F and #00FFFF need careful pairing for text; often, #2E2E2E or #F0F0F0 text is best.
Avoid using #6A057F and #2E2E2E for small text elements in close proximity due to low contrast.
Test color pairings for text and interactive elements to ensure clear distinction for all users, including those with color blindness.

Recommended combinations

Neon Alley

A dark, urban backdrop with vibrant cyan and pink neon accents, ideal for digital signage or UI highlights.

#2E2E2E · #00FFFF · #FF007F

Cyber Glow

Light backgrounds with a deep purple for content and electric cyan for links or interactive elements.

#F0F0F0 · #6A057F · #00FFFF

Graffiti Pulse

Bold, contrasting elements for calls-to-action or striking graphical overlays, mimicking vibrant street art.

#FF007F · #6A057F · #2E2E2E

CSS variables

:root {
  --cyber-glow-graffiti-1: #FF007F;
  --cyber-glow-graffiti-2: #00FFFF;
  --cyber-glow-graffiti-3: #6A057F;
  --cyber-glow-graffiti-4: #2E2E2E;
  --cyber-glow-graffiti-5: #F0F0F0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cyber-glow-graffiti": {
        1: "#FF007F",
        2: "#00FFFF",
        3: "#6A057F",
        4: "#2E2E2E",
        5: "#F0F0F0",
      }
    }
  }
}

Hex values

Color 1#FF007F

Color 2#00FFFF

Color 3#6A057F

Color 4#2E2E2E

Color 5#F0F0F0

Accessibility

Contrast checker

3:1AA18

2.9:1Fail

3.6:1AA18

3.3:1AA18

3:1AA18

8.6:1AAA

10.8:1AAA

1.1:1Fail

2.9:1Fail

8.6:1AAA

1.3:1Fail

9.5:1AAA

3.6:1AA18

10.8:1AAA

1.3:1Fail

11.9:1AAA

3.3:1AA18

1.1:1Fail

9.5:1AAA

11.9:1AAA

Similar palettes

More like Cyber Glow Graffiti

Cyberpunk Electric Surge