Palette

Shadowed Alley Glimmer

A brooding palette of deep grays, evoking the shadowy depths and subtle reflections of a dark urban alley.

darkdark5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Shadowed Alley Glimmer 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 Shadowed Alley Glimmer.

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

Data visualization

#1C1C1E#36363B#525258#73737C#A0A0A9

Palette guide

How to use Shadowed Alley Glimmer

Overview

The Shadowed Alley Glimmer palette offers a sophisticated range of deep, muted grays perfect for creating a mysterious and elegant digital experience. Anchored by the near-black #1C1C1E, it transitions through the deep charcoal of #36363B and the balanced #525258, culminating in the lighter, reflective #A0A0A9. This collection is ideal for UI designers seeking a dark mode theme with subtle depth or developers crafting a minimalist aesthetic. Its urban noir feel allows for a cohesive, understated design that emphasizes content without overwhelming the user. The subtle shifts in tone, like #73737C, provide excellent visual hierarchy.

Best used for

Dark mode UI themes
Luxury brand websites and apps
Photography portfolios
Architectural design presentations
Sophisticated tech product interfaces
Film and entertainment promotional materials

Suggested color roles

primary

Use #1C1C1E for dominant backgrounds or large content blocks to establish a deep, immersive feel.

secondary

Apply #36363B for secondary panels, cards, or section dividers, providing a subtle contrast to the primary dark.

accent

Employ #A0A0A9 sparingly for interactive elements, highlights, or subtle iconography to catch the eye without being jarring.

background

#1C1C1E provides a rich, deep foundation, or #36363B for a slightly less intense dark background.

text

For primary text, use a light gray like #A0A0A9 or near-white on darker backgrounds. For secondary text, #73737C offers good readability on #36363B.

Accessibility notes

Ensure sufficient contrast between text and background, especially when using #73737C on #525258.
Use #A0A0A9 for primary text on #1C1C1E or #36363B for WCAG AA compliance.
Avoid using #525258 or #73737C for small text sizes on similar mid-tone backgrounds.
Large text elements can utilize slightly lower contrast ratios, but always prioritize readability.

Recommended combinations

Urban Noir

Ideal for high-contrast dark mode interfaces, using the lightest shade for key interactive elements.

#1C1C1E · #36363B · #A0A0A9

Subtle Depth

Creates layered design elements with gentle tonal shifts, perfect for cards or panels.

#36363B · #525258 · #73737C

Glimmer Highlight

A base dark with a mid-tone for secondary info and a bright accent for calls to action.

#1C1C1E · #73737C · #A0A0A9

CSS variables

:root {
  --shadowed-alley-glimmer-1: #1C1C1E;
  --shadowed-alley-glimmer-2: #36363B;
  --shadowed-alley-glimmer-3: #525258;
  --shadowed-alley-glimmer-4: #73737C;
  --shadowed-alley-glimmer-5: #A0A0A9;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "shadowed-alley-glimmer": {
        1: "#1C1C1E",
        2: "#36363B",
        3: "#525258",
        4: "#73737C",
        5: "#A0A0A9",
      }
    }
  }
}

Hex values

Color 1#1C1C1E

Color 2#36363B

Color 3#525258

Color 4#73737C

Color 5#A0A0A9

Accessibility

Contrast checker

1.4:1Fail

2.2:1Fail

3.6:1AA18

6.6:1AA

1.4:1Fail

1.5:1Fail

2.6:1Fail

4.6:1AA

2.2:1Fail

1.5:1Fail

1.7:1Fail

3:1Fail

3.6:1AA18

2.6:1Fail

1.7:1Fail

1.8:1Fail

6.6:1AA

4.6:1AA

3:1Fail

1.8:1Fail

Similar palettes

More like Shadowed Alley Glimmer

Midnight Library Gloom

Midnight Tempest Shadow

Noir City Rain