Back to palettes

Palette

Monochrome Charcoal Depth

A sophisticated grayscale gradient, exploring the subtle nuances from dark charcoal to light smoke.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Monochrome Charcoal Depth 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 Monochrome Charcoal Depth.

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 Monochrome Charcoal Depth

Overview

The "Monochrome Charcoal Depth" palette is a sophisticated gradient exploring the rich nuances from deep charcoal to light smoke. Featuring anchoring #1A1A1A, balanced #333333 and #4D4D4D, and lighter #666666 and #808080, this collection provides exceptional depth and elegance. It's an ideal choice for designers and developers aiming for a professional, modern, and understated aesthetic. The seamless transition between shades allows for dynamic visual hierarchies and subtle textural effects, perfect for interfaces, branding, or editorial content that demands a refined, serious, and cool-toned approach. This palette ensures a sleek and contemporary feel.

Best used for

  • High-end corporate websites
  • Dark mode UI/UX designs
  • Luxury brand presentations
  • Photography and art portfolios
  • Professional software interfaces
  • Modern architectural design websites

Suggested color roles

primary

Use #1A1A1A as the dominant background or for prominent elements, providing a deep, sophisticated anchor.

secondary

Apply #333333 or #4D4D4D for secondary panels, cards, or section backgrounds, offering subtle differentiation.

accent

Utilize #666666 or #808080 for subtle highlights, interactive elements, or icons, providing gentle contrast.

background

Employ #1A1A1A or #333333 for a deep, immersive background, or #808080 for a lighter primary content area.

text

For dark backgrounds, use #808080 or a crisp white. For lighter backgrounds like #808080, use #1A1A1A or #333333 for body text.

Accessibility notes

  • Ensure sufficient contrast when using #808080 text on #1A1A1A backgrounds, or vice versa.
  • Avoid pairing #666666 with #808080 for small text; the contrast may be insufficient.
  • Always test text color against background color to meet WCAG contrast guidelines, especially for critical information.
  • Consider using a near-white for text on the darkest shades for optimal readability.

Recommended combinations

Deep & Clear

Ideal for a dark theme: #1A1A1A as background, #808080 for main text, and #333333 for secondary elements.

#1A1A1A · #808080 · #333333

Subtle Gradients

Excellent for layering UI components, creating depth with soft transitions in dashboards or complex interfaces.

#333333 · #4D4D4D · #666666

Modern Read

Use #1A1A1A for headings, #666666 for subheadings, and #808080 for body text on a very light background (e.g., white).

#1A1A1A · #666666 · #808080

CSS variables

:root {
  --monochrome-charcoal-depth-1: #1A1A1A;
  --monochrome-charcoal-depth-2: #333333;
  --monochrome-charcoal-depth-3: #4D4D4D;
  --monochrome-charcoal-depth-4: #666666;
  --monochrome-charcoal-depth-5: #808080;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "monochrome-charcoal-depth": {
        1: "#1A1A1A",
        2: "#333333",
        3: "#4D4D4D",
        4: "#666666",
        5: "#808080",
      }
    }
  }
}

Related searches

charcoal grey color schememonochromatic dark palettedeep grey hex codesprofessional grey designsophisticated monochrome

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 Monochrome Charcoal Depth

View all monochrome
Cloud Grey Mirage
Monochromatic Foggy City
Monochromatic Mist
Monochrome Ash Veil
Basalt Stream Pebble
Calm Stone Meditate