Back to palettes

Palette

Graphite Shadow

A sophisticated grayscale gradient, moving from deep charcoal to a soft, ethereal gray.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#343A40#495057#6C757D#ADB5BD#CED4DA

Palette guide

How to use Graphite Shadow

Overview

The Graphite Shadow palette offers a sophisticated grayscale gradient, moving smoothly from deep charcoal to a soft, ethereal gray. This collection features the profound #343A40, balanced mid-tones like #495057 and #6C757D, and airy light grays such as #ADB5BD and #CED4DA. It's perfect for designers aiming to create modern, clean, and highly versatile visuals that convey professionalism and understated elegance. The subtle shifts in tone provide excellent opportunities for creating depth, shadows, and highlights in UI design, branding, or any project that benefits from a refined, contemporary aesthetic.

Best used for

  • Modern web and mobile interfaces
  • Corporate branding and logos
  • Professional presentations
  • Minimalist photography displays
  • Technical documentation layouts
  • Elegant print media

Suggested color roles

primary

Use #343A40 as a dominant color for headings or main content sections, providing a strong, authoritative presence.

secondary

Apply #495057 for subheadings, secondary text, or UI elements, offering a slightly softer, yet robust gray.

accent

Employ #ADB5BD for subtle highlights, interactive states, or background accents, adding a touch of lightness and modernity.

background

Utilize #CED4DA for clean, spacious backgrounds that allow darker elements to stand out with clarity and softness.

text

For primary text on light backgrounds, #343A40 offers excellent readability. On darker backgrounds, use #CED4DA or #ADB5BD.

Accessibility notes

  • Ensure sufficient contrast when using #ADB5BD or #CED4DA for text on lighter backgrounds.
  • The darkest colors, #343A40 and #495057, provide excellent readability for white or very light text.
  • Avoid using adjacent light shades (e.g., #ADB5BD and #CED4DA) for text/background pairs due to low contrast.
  • For interactive elements, ensure distinct visual feedback using contrasting shades, such as #343A40 for active states on #CED4DA.

Recommended combinations

Smooth Gradient

Ideal for background gradients or layered panels, creating smooth visual transitions.

#343A40 · #495057 · #6C757D

Clean Readability

Light background with dark text for headings and secondary information, maximizing clarity.

#CED4DA · #343A40 · #495057

Subtle Depth

Mid-gray base with lighter accents and a dark charcoal for key elements or text.

#6C757D · #ADB5BD · #343A40

CSS variables

:root {
  --graphite-shadow-1: #343A40;
  --graphite-shadow-2: #495057;
  --graphite-shadow-3: #6C757D;
  --graphite-shadow-4: #ADB5BD;
  --graphite-shadow-5: #CED4DA;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "graphite-shadow": {
        1: "#343A40",
        2: "#495057",
        3: "#6C757D",
        4: "#ADB5BD",
        5: "#CED4DA",
      }
    }
  }
}

Related searches

grayscale gradient palettedark gray color schememodern monochrome designsophisticated gray UIshadow gray branding

Palette colors

Hex values

Color 1#343A40
·
Color 2#495057
·
Color 3#6C757D
·
Color 4#ADB5BD
·
Color 5#CED4DA
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2.5:1Fail
5.5:1AA
7.7:1AAA
2
1.4:1Fail
1.7:1Fail
3.9:1AA18
5.5:1AA
3
2.5:1Fail
1.7:1Fail
2.3:1Fail
3.1:1AA18
4
5.5:1AA
3.9:1AA18
2.3:1Fail
1.4:1Fail
5
7.7:1AAA
5.5:1AA
3.1:1AA18
1.4:1Fail

Similar palettes

More like Graphite Shadow

View all monochrome
Abstract Grid Pattern
Art Gallery Minimal
Charcoal Graphite Tones
Charcoal Sketch Study
Concrete Zenith Edge
Graphite Study Hues