Palette

Downtown Neon Canvas

Explores the vivid, glowing artistry of neon signs reflecting on a dark city street, full of urban thrill.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Downtown Neon Canvas 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 Downtown Neon Canvas.

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

Data visualization

#120E1A#FF0077#00FFFF#FFD700#6A00FF

Palette guide

How to use Downtown Neon Canvas

Overview

The "Downtown Neon Canvas" palette is a vivid exploration of urban thrill, capturing the glowing artistry of neon signs reflecting on a dark city street. This electrifying collection features a very dark, almost black, indigo #120E1A, a vibrant shocking pink #FF0077, a brilliant cyan #00FFFF, a luminous gold #FFD700, and an intense violet #6A00FF. Designers can leverage these captivating hues to create high-energy, futuristic experiences, perfect for branding, digital interfaces, or motion graphics that aim to evoke excitement and a cutting-edge aesthetic. It’s ideal for projects seeking a bold, modern, and visually striking appeal.

Best used for

Cyberpunk or futuristic game UI
Nightclub or concert event branding
Tech startup websites or app interfaces
Motion graphics and video titles
Fashion or beauty branding with an edgy twist
Digital art and abstract neon illustrations

Suggested color roles

primary

A vibrant shocking pink #FF0077 that commands immediate attention, reminiscent of glowing neon. Ideal for calls-to-action, key highlights, or main brand elements.

secondary

A brilliant cyan #00FFFF that offers a cool, electric contrast. Excellent for secondary navigation, interactive elements, or dramatic visual effects.

accent

A luminous gold #FFD700 that adds a touch of metallic gleam and warmth. Perfect for subtle highlights, small icons, or decorative flourishes.

background

A very dark, almost black, indigo #120E1A that provides an ideal deep, moody backdrop, allowing the neon colors to truly pop and glow.

text

An intense violet #6A00FF that offers a unique and striking text color, best used for larger headings or decorative elements against dark backgrounds. For body text, ensure sufficient contrast or use a lighter neutral.

Accessibility notes

#FFD700 (gold) text on #120E1A (dark indigo) can work for larger headings, but verify contrast for body text.
#FF0077 (pink) or #00FFFF (cyan) on #120E1A (dark indigo) should offer good contrast for headings and interactive elements.
Avoid using #6A00FF (violet) text on #FF0077 (pink) or #00FFFF (cyan) due to low contrast and color vibration.
Ensure interactive elements have distinct hover/focus states, as the vibrancy can be intense.

Recommended combinations

Neon City Lights

Dark-themed websites, game interfaces, or digital art where neon glow is central.

#120E1A · #FF0077 · #00FFFF

Cyberpunk Glow

UI highlights, futuristic branding, or motion graphics needing high energy.

#00FFFF · #FFD700 · #6A00FF

Dramatic Contrast

Powerful calls-to-action, striking banners, or designs that demand immediate visual impact.

#FF0077 · #6A00FF · #120E1A

CSS variables

:root {
  --downtown-neon-canvas-1: #120E1A;
  --downtown-neon-canvas-2: #FF0077;
  --downtown-neon-canvas-3: #00FFFF;
  --downtown-neon-canvas-4: #FFD700;
  --downtown-neon-canvas-5: #6A00FF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "downtown-neon-canvas": {
        1: "#120E1A",
        2: "#FF0077",
        3: "#00FFFF",
        4: "#FFD700",
        5: "#6A00FF",
      }
    }
  }
}

Hex values

Color 1#120E1A

Color 2#FF0077

Color 3#00FFFF

Color 4#FFD700

Color 5#6A00FF

Accessibility

Contrast checker

5:1AA

15.2:1AAA

13.6:1AAA

2.8:1Fail

5:1AA

3:1AA18

2.7:1Fail

1.8:1Fail

15.2:1AAA

3:1AA18

1.1:1Fail

5.5:1AA

13.6:1AAA

2.7:1Fail

1.1:1Fail

4.9:1AA

2.8:1Fail

1.8:1Fail

5.5:1AA

4.9:1AA

Similar palettes

More like Downtown Neon Canvas