Back to palettes

Palette

Downtown Neon Noir

Reflects the dark, atmospheric nights of a city, punctuated by artificial, electric lights.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0a0a1a#330033#cc0066#0099ff#666666

Palette guide

How to use Downtown Neon Noir

Overview

The "Downtown Neon Noir" palette reflects the dark, atmospheric nights of a city, punctuated by artificial, electric lights, evoking a moody yet captivating urban landscape. This sophisticated collection features a very dark navy #0a0a1a, a deep plum #330033, a vibrant fuchsia #cc0066, a brilliant sky blue #0099ff, and a versatile medium grey #666666. Designers can leverage these compelling hues to create atmospheric and edgy experiences, perfect for branding, digital interfaces, or print materials that aim to convey a sense of mystery, urban elegance, and electric energy. It’s ideal for projects seeking a dark, modern, and visually intriguing appeal.

Best used for

  • Noir-themed game or film aesthetics
  • Nightlife venue branding (e.g., bars, clubs)
  • UI/UX for dark mode applications
  • Fashion or luxury branding with an edgy twist
  • Digital art and moody abstract illustrations
  • Event promotions for sophisticated evening events

Suggested color roles

primary

A very dark, almost black, navy #0a0a1a that provides a deep, mysterious foundation. Ideal for main backgrounds, large blocks, or primary structural elements.

secondary

A vibrant fuchsia #cc0066 that offers a striking, neon-like accent. Excellent for calls-to-action, key highlights, or interactive elements to draw attention.

accent

A brilliant sky blue #0099ff that provides a cool, electric glow. Perfect for subtle highlights, small icons, or decorative lines to simulate neon.

background

A deep plum #330033 that serves as a rich, atmospheric background, adding depth and allowing the brighter neon colors to emerge.

text

A versatile medium grey #666666 that offers good readability against dark backgrounds like #0a0a1a or #330033, providing a subtle yet clear text color for body copy.

Accessibility notes

  • #666666 (medium grey) text on #0a0a1a (dark navy) or #330033 (deep plum) provides good contrast for body text.
  • #cc0066 (fuchsia) or #0099ff (sky blue) on #0a0a1a (dark navy) should offer good contrast for headings and interactive elements.
  • Avoid using #666666 (medium grey) text on #cc0066 (fuchsia) or #0099ff (sky blue) due to low contrast.
  • Ensure interactive elements have distinct hover/focus states, as the dark background can make subtle changes hard to perceive.

Recommended combinations

Neon Night Scene

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

#0A0A1A · #CC0066 · #0099FF

Urban Mystery

Branding for a sophisticated bar, dark mode UI, or elegant evening event invitations.

#330033 · #666666 · #CC0066

Electric Accents

UI highlights, striking banners, or graphic elements that need a powerful, artificial light effect.

#0099FF · #CC0066 · #0A0A1A

CSS variables

:root {
  --downtown-neon-noir-1: #0a0a1a;
  --downtown-neon-noir-2: #330033;
  --downtown-neon-noir-3: #cc0066;
  --downtown-neon-noir-4: #0099ff;
  --downtown-neon-noir-5: #666666;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "downtown-neon-noir": {
        1: "#0a0a1a",
        2: "#330033",
        3: "#cc0066",
        4: "#0099ff",
        5: "#666666",
      }
    }
  }
}

Related searches

downtown neon noir palettedark urban city colorsmoody electric designcyberpunk night aestheticpurple blue grey neon

Palette colors

Hex values

Color 1#0a0a1a
·
Color 2#330033
·
Color 3#cc0066
·
Color 4#0099ff
·
Color 5#666666
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
3.5:1AA18
6.5:1AA
3.4:1AA18
2
1.1:1Fail
3.2:1AA18
5.9:1AA
3.1:1AA18
3
3.5:1AA18
3.2:1AA18
1.9:1Fail
1:1Fail
4
6.5:1AA
5.9:1AA
1.9:1Fail
1.9:1Fail
5
3.4:1AA18
3.1:1AA18
1:1Fail
1.9:1Fail

Similar palettes

More like Downtown Neon Noir

View all dark
Noir City Rain
Acid Rain Gloom
City After Hours
City Neon Rain
City Night Canvas
City Night Concrete