Back to palettes

Palette

Midnight Alley Tale

A brooding greyscale palette evoking the shadowy streets and whispered secrets of a midnight alleyway.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Midnight Alley Tale 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 Midnight Alley Tale.

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

Data visualization

#0A0A0A#282828#4D4D4D#707070#939393

Palette guide

How to use Midnight Alley Tale

Overview

The Midnight Alley Tale palette is a brooding greyscale collection, evoking the shadowy streets and whispered secrets of a midnight alleyway. Featuring deep black #0A0A0A, dark grey #282828, medium grey #4D4D4D, light grey #707070, and very light grey #939393, this palette is perfect for designers aiming for a minimalist, mysterious, or sophisticated dark aesthetic. The progression of greys allows for subtle depth and texture, making it versatile for creating impactful, high-contrast designs. It's an excellent choice for projects requiring a serious, modern, or urban feel, from conceptual art to high-tech interfaces, providing a strong sense of drama and focus.

Best used for

  • Dark mode UI/UX design
  • Cybersecurity or tech branding
  • Mystery novel covers or film noir aesthetics
  • Urban photography portfolios
  • Minimalist fashion or luxury product websites
  • Conceptual art and digital illustration

Suggested color roles

primary

Use #0A0A0A as a dominant primary for backgrounds or foundational elements, establishing a deep mood.

secondary

Apply #282828 for supporting panels, card backgrounds, or to add subtle depth.

accent

Introduce #707070 for interactive elements, subtle borders, or to guide user attention without distraction.

background

Employ #0A0A0A or #282828 for main backgrounds, providing a dark, immersive canvas.

text

Utilize #939393 or #707070 for primary body text, ensuring excellent readability against darker backgrounds.

Accessibility notes

  • Ensure sufficient contrast for text, especially when pairing #939393 or #707070 with #0A0A0A or #282828.
  • Avoid using #4D4D4D or #282828 for text on #0A0A0A, as contrast may be insufficient.
  • Always test text against backgrounds to ensure WCAG AA compliance, particularly with various grey shades.
  • For critical information, use #939393 on #0A0A0A for maximum legibility in a dark theme.

Recommended combinations

Deep Contrast

Ideal for high-contrast headers, primary content blocks, or striking visual statements.

#0A0A0A · #939393 · #4D4D4D

Subtle Depth

Excellent for UI elements, card backgrounds, or sections needing a nuanced dark aesthetic.

#282828 · #707070 · #4D4D4D

Urban Edge

Creates a modern, minimalist look for navigation, footers, or subtle branding elements.

#0A0A0A · #707070 · #939393

CSS variables

:root {
  --midnight-alley-tale-1: #0A0A0A;
  --midnight-alley-tale-2: #282828;
  --midnight-alley-tale-3: #4D4D4D;
  --midnight-alley-tale-4: #707070;
  --midnight-alley-tale-5: #939393;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "midnight-alley-tale": {
        1: "#0A0A0A",
        2: "#282828",
        3: "#4D4D4D",
        4: "#707070",
        5: "#939393",
      }
    }
  }
}

Related searches

dark greyscale palettemidnight black grey schemeurban mystery colorsminimalist dark mode designsophisticated black and grey

Palette colors

Hex values

Color 1#0A0A0A
·
Color 2#282828
·
Color 3#4D4D4D
·
Color 4#707070
·
Color 5#939393
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
2.3:1Fail
4:1AA18
6.4:1AA
2
1.3:1Fail
1.7:1Fail
3:1Fail
4.8:1AA
3
2.3:1Fail
1.7:1Fail
1.7:1Fail
2.8:1Fail
4
4:1AA18
3:1Fail
1.7:1Fail
1.6:1Fail
5
6.4:1AA
4.8:1AA
2.8:1Fail
1.6:1Fail

Similar palettes

More like Midnight Alley Tale

View all dark
Cosmic Void Depths
Dark Sea Onyx
Gothic Chapel Stone
Gothic Library Ink
Industrial Grid Noir
Midnight Library Study