Back to palettes

Palette

City Neon Rain

The slick, reflective glow of city lights on a rainy night, dominated by cool blues.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#000000#2C3E50#3498DB#85C1E9#D6EAF8

Palette guide

How to use City Neon Rain

Overview

The "City Neon Rain" palette captures the slick, reflective glow of city lights on a rainy night, dominated by cool, deep blues and grounded by a stark black. Featuring absolute #000000, a deep #2C3E50, a vivid #3498DB, a lighter #85C1E9, and a soft #D6EAF8, this palette creates a moody yet dynamic atmosphere. Designers can leverage these tones to evoke a sense of urban mystery, technology, or calm sophistication. Developers will find these hex codes excellent for creating modern dark mode interfaces, atmospheric backgrounds, and clean data visualizations. It's ideal for projects requiring a blend of depth, coolness, and subtle vibrancy, perfect for tech, automotive, or artistic applications.

Best used for

  • Dark mode application themes
  • Automotive brand websites
  • Tech startup landing pages
  • Urban photography portfolios
  • Mystery novel covers
  • Nightlife event promotions

Suggested color roles

primary

#2C3E50 - A deep, cool blue-grey, excellent for primary content areas, main headings, or brand elements, establishing a solid, moody foundation.

secondary

#3498DB - A vibrant, clear blue, perfect for calls-to-action, interactive elements, or key information that needs to stand out against darker tones.

accent

#85C1E9 - A light, ethereal blue, ideal for subtle highlights, borders, or background patterns, adding a touch of luminosity.

background

#000000 - Absolute black, serving as the ultimate deep canvas that allows the blues to glow and reflective effects to truly stand out.

text

#D6EAF8 - A very light blue, optimal for primary body text against #000000 or #2C3E50, ensuring excellent readability and a cohesive, cool aesthetic.

Accessibility notes

  • Ensure high contrast for #D6EAF8 text on #000000 or #2C3E50 backgrounds to meet WCAG AA standards.
  • Avoid using #85C1E9 for small text on #3498DB, as contrast may be insufficient.
  • Provide clear non-color-based indicators for interactive elements, as the palette's depth can sometimes obscure subtle color changes.
  • For critical alerts, consider using a high-contrast white text against the darkest background.

Recommended combinations

Night City Interface

Ideal for dark mode dashboards or tech interfaces, providing depth with clear interactive highlights.

#000000 · #2C3E50 · #3498DB

Rainy Glow

Perfect for creating atmospheric backgrounds, subtle gradients, or reflective UI elements.

#2C3E50 · #85C1E9 · #D6EAF8

Deep Contrast

Great for establishing strong visual hierarchy in web designs, making key information pop against a dark canvas.

#000000 · #3498DB · #D6EAF8

CSS variables

:root {
  --city-neon-rain-2-1: #000000;
  --city-neon-rain-2-2: #2C3E50;
  --city-neon-rain-2-3: #3498DB;
  --city-neon-rain-2-4: #85C1E9;
  --city-neon-rain-2-5: #D6EAF8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "city-neon-rain-2": {
        1: "#000000",
        2: "#2C3E50",
        3: "#3498DB",
        4: "#85C1E9",
        5: "#D6EAF8",
      }
    }
  }
}

Related searches

dark blue urban paletteneon rain city colorsmoody blue web designtech dark mode schemereflective city night hex

Palette colors

Hex values

Color 1#000000
·
Color 2#2C3E50
·
Color 3#3498DB
·
Color 4#85C1E9
·
Color 5#D6EAF8
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
6.7:1AA
10.8:1AAA
17:1AAA
2
1.9:1Fail
3.5:1AA18
5.6:1AA
8.9:1AAA
3
6.7:1AA
3.5:1AA18
1.6:1Fail
2.6:1Fail
4
10.8:1AAA
5.6:1AA
1.6:1Fail
1.6:1Fail
5
17:1AAA
8.9:1AAA
2.6:1Fail
1.6:1Fail

Similar palettes

More like City Neon Rain

View all dark
Midnight Urban Glow
Suburban Night Lights
Basalt Edge
City After Hours
Galactic Star Dust
Midnight Celestial Bloom