Back to palettes

Palette

Urban Night Rhythm

A pulsating cityscape at night, alive with electric lights and vibrant energy.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Urban Night Rhythm 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 Night Rhythm.

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

Data visualization

#2C2C2C#6A5ACD#00FFFF#FFD700#F0F0F0

Palette guide

How to use Urban Night Rhythm

Overview

The Urban Night Rhythm palette pulsates with the electric energy of a metropolis after dark. Featuring deep charcoal #2C2C2C, sophisticated violet #6A5ACD, striking cyan #00FFFF, radiant gold #FFD700, and a crisp near-white #F0F0F0, it’s perfect for designs requiring dynamism and a modern edge. This guide assists designers and developers in leveraging its vibrant contrasts and bold accents to create engaging, memorable digital experiences. From UI elements to compelling brand identities, these colors evoke a sense of excitement and contemporary flair, reflecting a bustling cityscape.

Best used for

  • High-tech product interfaces and landing pages
  • Event promotion materials (concerts, festivals, nightlife)
  • Gaming UI/UX and streaming channel branding
  • Modern fashion or streetwear brand identity
  • Digital art and motion graphics
  • Dynamic web applications requiring a dark, energetic theme

Suggested color roles

primary

#2C2C2C - A grounding, deep charcoal perfect for backgrounds, containers, or primary navigation elements, providing a sophisticated dark base.

secondary

#6A5ACD - A rich, vibrant violet ideal for interactive elements, secondary branding, or large graphical accents that demand attention without overpowering.

accent

#00FFFF - An electric cyan, best used sparingly for call-to-action buttons, key highlights, or progress indicators to add a jolt of energy.

background

#F0F0F0 - A clean, light background for content areas, offering stark contrast and breathability, or use #2C2C2C for a dark theme base.

text

#F0F0F0 for light text on dark backgrounds like #2C2C2C, or a dark charcoal for readability on #F0F0F0.

Accessibility notes

  • Ensure sufficient contrast for text using #00FFFF or #FFD700 on any background; these are best for large headlines or graphic elements.
  • Text in #2C2C2C on #F0F0F0 offers excellent readability for body copy.
  • Avoid placing #00FFFF directly next to #FFD700 without a separating element, as their high saturation can cause visual vibration.
  • #6A5ACD provides good contrast for headings and important information when paired with #F0F0F0 or even #2C2C2C.

Recommended combinations

Neon Glow

Dynamic headers, call-to-action buttons, or vibrant data visualizations in a dark context.

#2C2C2C · #00FFFF · #FFD700

City Pulse

Elegant branding, hero sections, or sophisticated UI elements with a touch of color.

#F0F0F0 · #6A5ACD · #2C2C2C

Electric Night

Interactive elements, hover states, or graphic overlays in a bright context to draw the eye.

#6A5ACD · #00FFFF · #F0F0F0

CSS variables

:root {
  --urban-night-rhythm-1: #2C2C2C;
  --urban-night-rhythm-2: #6A5ACD;
  --urban-night-rhythm-3: #00FFFF;
  --urban-night-rhythm-4: #FFD700;
  --urban-night-rhythm-5: #F0F0F0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "urban-night-rhythm": {
        1: "#2C2C2C",
        2: "#6A5ACD",
        3: "#00FFFF",
        4: "#FFD700",
        5: "#F0F0F0",
      }
    }
  }
}

Related searches

vibrant city color schemesneon tech paletteenergetic purple yellow cyanmodern nightlife colorsdark mode vibrant ui

Palette colors

Hex values

Color 1#2C2C2C
·
Color 2#6A5ACD
·
Color 3#00FFFF
·
Color 4#FFD700
·
Color 5#F0F0F0
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.6:1Fail
11.1:1AAA
10:1AAA
12.3:1AAA
2
2.6:1Fail
4.2:1AA18
3.8:1AA18
4.7:1AA
3
11.1:1AAA
4.2:1AA18
1.1:1Fail
1.1:1Fail
4
10:1AAA
3.8:1AA18
1.1:1Fail
1.2:1Fail
5
12.3:1AAA
4.7:1AA
1.1:1Fail
1.2:1Fail

Similar palettes

More like Urban Night Rhythm

View all vibrant
Abstract City Lights
City Neon Rain
Cyber Glow Graffiti
Electric City Rhythm
Urban Neon Alley
Aurora Glade Whisper