Back to palettes

Palette

Grayscale Deep Mood

A sophisticated grayscale capturing the subtle shifts of mood and depth in light.

monochromedark5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Grayscale Deep Mood 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 Grayscale Deep Mood.

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

Data visualization

#1A1A1A#333333#4D4D4D#666666#808080

Palette guide

How to use Grayscale Deep Mood

Overview

The Grayscale Deep Mood palette offers a sophisticated and intense monochromatic range, capturing subtle shifts of mood and depth. Anchored by the near-black #1A1A1A, and progressing through deep greys like #333333 and #4D4D4D, to the slightly lighter #666666 and #808080, this palette is perfect for creating a powerful, modern, and elegant aesthetic. Designers and developers can leverage these rich, dark tones to establish a strong brand presence, evoke a sense of luxury, or provide a dramatic backdrop for vibrant content. It excels in designs that require gravitas and a refined, serious tone.

Best used for

  • High-end luxury brand websites
  • Dark mode interfaces for apps or operating systems
  • Photography portfolios showcasing dramatic imagery
  • Film or music production company branding
  • Modern art gallery digital experiences
  • Cybersecurity or tech-focused platforms

Suggested color roles

primary

Use #1A1A1A for dominant backgrounds, headers, or bold statements to create a deep, immersive feel.

secondary

Apply #333333 for content panels, navigation bars, or secondary headings, maintaining a consistent dark aesthetic.

accent

#666666 or #808080 can serve as subtle accents for borders, inactive states, or small icons, providing gentle visual separation.

background

#1A1A1A provides a strong, sophisticated base. For content areas, #333333 offers a slightly lighter, yet still deep, canvas.

text

For primary text, use a light grey like #808080 or a near-white color for optimal contrast against the darker backgrounds.

Accessibility notes

  • Ensure light grey text (e.g., #808080) on darker backgrounds (e.g., #1A1A1A, #333333) meets WCAG AA contrast for readability.
  • Avoid using very dark greys for text on only slightly darker grey backgrounds as contrast will be insufficient.
  • Provide clear focus indicators for interactive elements, as subtle color changes might not be enough.
  • Use ample line height and letter spacing for readability, especially with light text on dark backgrounds.

Recommended combinations

Deep Contrast

Ideal for dark mode interfaces, combining a deep background with light text and a mid-tone for secondary elements.

#1A1A1A · #808080 · #333333

Layered Shadows

Excellent for creating subtle depth and hierarchy within content blocks or complex UI components.

#333333 · #4D4D4D · #666666

Elegant Foundation

Suited for branding and hero sections, conveying sophistication and a strong, modern presence.

#1A1A1A · #666666 · #4D4D4D

CSS variables

:root {
  --grayscale-deep-mood-1: #1A1A1A;
  --grayscale-deep-mood-2: #333333;
  --grayscale-deep-mood-3: #4D4D4D;
  --grayscale-deep-mood-4: #666666;
  --grayscale-deep-mood-5: #808080;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "grayscale-deep-mood": {
        1: "#1A1A1A",
        2: "#333333",
        3: "#4D4D4D",
        4: "#666666",
        5: "#808080",
      }
    }
  }
}

Related searches

dark grey color palettedeep monochrome schemesophisticated grayscale designmodern dark theme colorselegant grey branding

Palette colors

Hex values

Color 1#1A1A1A
·
Color 2#333333
·
Color 3#4D4D4D
·
Color 4#666666
·
Color 5#808080
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2.1:1Fail
3:1AA18
4.4:1AA18
2
1.4:1Fail
1.5:1Fail
2.2:1Fail
3.2:1AA18
3
2.1:1Fail
1.5:1Fail
1.5:1Fail
2.1:1Fail
4
3:1AA18
2.2:1Fail
1.5:1Fail
1.5:1Fail
5
4.4:1AA18
3.2:1AA18
2.1:1Fail
1.5:1Fail

Similar palettes

More like Grayscale Deep Mood

View all monochrome
Retro Dark Cinema
Basalt Pillar Shades
Gothic Revival
Gritty Industrial Grey
Licorice Drop
Midnight Ink Spill