Back to palettes

Palette

Dark Moody Portrait

A profound blend of deep, shadowed grays, perfect for creating dramatic and intense visuals.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Dark Moody Portrait 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 Dark Moody Portrait.

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

Data visualization

#1F1F1F#383838#555555#7A7A7A#A1A1A1

Palette guide

How to use Dark Moody Portrait

Overview

The Dark Moody Portrait palette offers a profound and dramatic blend of deep, shadowed grays, perfect for creating intense and sophisticated visuals. Ranging from the near-black #1F1F1F to the lighter #A1A1A1, this monochromatic palette is ideal for designs that aim for a cinematic, elegant, and timeless aesthetic. It's an excellent choice for photography portfolios, luxury branding, or any project that seeks to convey seriousness and depth. Designers can leverage its consistent gray tones for immersive backgrounds, while developers will find it perfect for creating dark mode themes that are both visually rich and incredibly versatile across various UI elements.

Best used for

  • Photography portfolio websites
  • Cinematic film titles or promotional materials
  • Luxury fashion or art branding
  • Dark mode UI for creative editing software
  • Elegant editorial layouts for high-end magazines
  • Abstract digital art with a dramatic flair

Suggested color roles

primary

#383838 - A deep charcoal gray that provides a strong, neutral foundation for primary elements, large sections, or brand identity.

secondary

#555555 - A balanced mid-tone gray, ideal for secondary content blocks, navigation, or as a subtle contrasting panel.

accent

#A1A1A1 - The lightest shade, a soft light gray, perfect for subtle highlights, interactive states, or delicate graphical details that need to stand out without being too bright.

background

#1F1F1F - A very dark, almost black gray, offering a profound, immersive background that enhances the moody and sophisticated feel of the palette.

text

#7A7A7A - A legible mid-tone gray that works well for body text on darker backgrounds within the palette. For optimal readability on the darkest shades, use a pure white (e.g., #FFFFFF).

Accessibility notes

  • Ensure sufficient contrast when using #A1A1A1 for text on darker backgrounds like #1F1F1F or #383838.
  • Avoid using #7A7A7A for primary text on #555555; contrast will be insufficient.
  • For critical text on the darkest backgrounds, opt for a pure white or very light gray to meet accessibility standards.
  • Monochromatic dark palettes require careful contrast checking for all text and interactive elements.

Recommended combinations

Cinematic Depth

Creating seamless, deep gray gradients for backgrounds or layered UI elements, adding dramatic depth.

#1F1F1F · #383838 · #555555

Subtle Highlight

Pairing a dominant dark gray with a light accent and a legible mid-tone gray for cards or feature blocks.

#383838 · #A1A1A1 · #7A7A7A

Layered Drama

Designing UI elements where subtle tonal shifts provide hierarchy without stark contrast, ideal for dashboards.

#555555 · #7A7A7A · #A1A1A1

CSS variables

:root {
  --dark-moody-portrait-1: #1F1F1F;
  --dark-moody-portrait-2: #383838;
  --dark-moody-portrait-3: #555555;
  --dark-moody-portrait-4: #7A7A7A;
  --dark-moody-portrait-5: #A1A1A1;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "dark-moody-portrait": {
        1: "#1F1F1F",
        2: "#383838",
        3: "#555555",
        4: "#7A7A7A",
        5: "#A1A1A1",
      }
    }
  }
}

Related searches

dark gray monochrome palettemoody portrait colorscinematic black white schemedramatic dark UI designelegant gray hex codes

Palette colors

Hex values

Color 1#1F1F1F
·
Color 2#383838
·
Color 3#555555
·
Color 4#7A7A7A
·
Color 5#A1A1A1
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2.2:1Fail
3.8:1AA18
6.4:1AA
2
1.4:1Fail
1.6:1Fail
2.7:1Fail
4.5:1AA
3
2.2:1Fail
1.6:1Fail
1.7:1Fail
2.9:1Fail
4
3.8:1AA18
2.7:1Fail
1.7:1Fail
1.7:1Fail
5
6.4:1AA
4.5:1AA
2.9:1Fail
1.7:1Fail

Similar palettes

More like Dark Moody Portrait

View all dark
Blackwater Grotto Gloom
Gothic Revival Vault
Midnight Library Gloom
Midnight Raven
Moonlit Abbey Shadow
Noir Alley Nocturne