Back to palettes

Palette

Shadow City Grime

A gritty, shadowy palette that captures the classic, dramatic mood of a film noir city alley.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Shadow City Grime 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 Shadow City Grime.

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

Data visualization

#1C1C1C#2F4F4F#424242#708090#A9A9A9

Palette guide

How to use Shadow City Grime

Overview

The "Shadow City Grime" palette masterfully captures the dramatic, gritty essence of an urban landscape, perfect for a film noir aesthetic. This collection features deep, enigmatic dark gray #1C1C1C, a cool dark slate #2F4F4F, and a versatile medium dark gray #424242. These foundational darks are complemented by a moody slate gray #708090 and a lighter, smoky gray #A9A9A9, introducing subtle atmospheric depth. This palette is expertly curated for designs requiring a serious, sophisticated, and slightly melancholic tone, evoking rain-slicked streets and shadowed alleys.

Best used for

  • Film noir aesthetics or movie posters
  • Urban photography websites
  • Dark mode interfaces for tech
  • Gritty video game environments
  • Sophisticated menswear branding
  • Conceptual art and digital illustrations

Suggested color roles

primary

#1C1C1C (deep dark gray). The ultimate background or dominant color for achieving a profound, shadowy atmosphere.

secondary

#2F4F4F (dark slate). Excellent for content containers, sidebars, or to add subtle variation from the primary dark.

accent

#708090 (moody slate gray). Use this for subtle highlights, interactive elements, or to break the intensity of the darker tones.

background

#424242 (medium dark gray). A strong, versatile base that allows for layering darker elements while maintaining depth.

text

#A9A9A9 or a crisp white for readability on the dark backgrounds; ensures legibility without being overly stark.

Accessibility notes

  • Ensure #A9A9A9 or white text provides sufficient contrast on all darker background colors in the palette.
  • Using any palette color other than #A9A9A9 for text on a dark background will likely fail contrast ratios.
  • For interactive elements, ensure clear visual feedback for hover/focus states, perhaps using a light glow.
  • Consider using #708090 for subheadings or secondary information if the background is #1C1C1C or #2F4F4F.

Recommended combinations

Urban Depths

Perfect for creating layered, dark mode interfaces or moody digital art backgrounds.

#1C1C1C · #2F4F4F · #424242

City Lights

Effective for showing subtle variations in light and shadow in architectural renderings.

#424242 · #708090 · #A9A9A9

Gritty Contrast

Ideal for high-contrast typography and minimalist branding with a dark edge.

#1C1C1C · #A9A9A9 · #708090

CSS variables

:root {
  --shadow-city-grime-1: #1C1C1C;
  --shadow-city-grime-2: #2F4F4F;
  --shadow-city-grime-3: #424242;
  --shadow-city-grime-4: #708090;
  --shadow-city-grime-5: #A9A9A9;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "shadow-city-grime": {
        1: "#1C1C1C",
        2: "#2F4F4F",
        3: "#424242",
        4: "#708090",
        5: "#A9A9A9",
      }
    }
  }
}

Related searches

dark urban color palettefilm noir colorsmoody city schemegritty gray tonessophisticated dark interface

Palette colors

Hex values

Color 1#1C1C1C
·
Color 2#2F4F4F
·
Color 3#424242
·
Color 4#708090
·
Color 5#A9A9A9
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
1.7:1Fail
4.2:1AA18
7.3:1AAA
2
1.9:1Fail
1.1:1Fail
2.2:1Fail
3.8:1AA18
3
1.7:1Fail
1.1:1Fail
2.5:1Fail
4.3:1AA18
4
4.2:1AA18
2.2:1Fail
2.5:1Fail
1.7:1Fail
5
7.3:1AAA
3.8:1AA18
4.3:1AA18
1.7:1Fail

Similar palettes

More like Shadow City Grime

View all dark
Midnight Alley Tale
Noir Alley Shadows
Noir Detective Mood
Abyssal Luminous Flora
Abyssal Trench Mystery
Bioluminescent Abyss