Graphite vs Charcoal vs Slate: The Real Difference
Dark greys are a designer’s best friend, but graphite vs charcoal vs slate trip people up because they cluster so tightly on the value scale. All three read as “sophisticated dark grey” at a glance, all three pair with almost anything, and all three are common in everything from suits to cabinetry to UI design systems. The differences are nonetheless real and worth knowing. They come down to two variables: how dark the grey is, and which undertone it leans toward, cool blue or neutral. Get those two right and you will never confuse a charcoal sofa with a slate one again.
Each color below gets a definition, an approximate hex code, an undertone description, and its strongest uses. A comparison table and decision guide follow so you can pick the right grey for the job.
Charcoal
Charcoal is the darkest and most dramatic of the three, sitting around #36454F in its classic form, a deep grey that hovers just shy of black. Named after burnt wood, charcoal has the depth of black but the softness of grey, which makes it more wearable and less harsh than true black. Its undertone is broadly neutral, though many charcoals carry a faint warm or blue cast depending on the source.
Because charcoal is so deep, it behaves almost like a black in a palette: it grounds, frames, and adds gravity. A charcoal suit is a step softer and more modern than a black one. A charcoal accent wall reads dramatic without feeling oppressive. In design, charcoal makes excellent body text and headers, providing strong contrast against light backgrounds while feeling less stark than pure #000000. Pair charcoal with white, warm wood, brass, blush, or mustard for a refined, contemporary look. If you want the closest comparison in the very dark range, the contrast between charcoal and the cooler greys below is the one to study.
Graphite
Graphite is the medium-dark middle option, sitting around #4D5358, lighter than charcoal but still firmly in dark-grey territory. Named after the pencil-lead mineral, graphite carries a cool, slightly metallic blue-grey undertone that gives it a modern, industrial feel. It reads as more refined and more “engineered” than charcoal, which is why it shows up so often in electronics, automotive finishes, and tech-forward branding.
The cool undertone is the key to graphite’s character. Where charcoal can lean neutral or warm, graphite consistently leans cool and metallic, almost as if there is a faint sheen of silver in it. This makes graphite excellent for sleek, contemporary contexts: phone casings, modern kitchen appliances, dark-mode interfaces, and minimalist branding. Pair it with white, cool blues, silver, and crisp accent colors. Avoid pairing graphite with very warm, golden neutrals, where its coolness can read as flat or lifeless by contrast.
Slate
Slate is the lightest of the three, sitting around #708090, a true mid-grey with a clear and unmistakable cool blue undertone. Named after the metamorphic stone, slate is the most colorful of the trio in the sense that you can actually perceive its blue tint without much effort. It is calmer and softer than graphite or charcoal because it is so much lighter on the value scale.
That blue undertone gives slate a serene, slightly moody quality that works beautifully in interiors and fashion alike. Slate-blue walls feel calming and current; a slate suit reads softer and more approachable than charcoal. In design, slate makes a good secondary or muted accent color, and slate-grey works well for subtitles, borders, and UI chrome where you want presence without heaviness. Pair slate with white, navy, dusty rose, mustard, or warm wood to balance its coolness. Because it is lighter, slate provides less contrast against white than the other two, so use it where bold contrast is not the priority.
Key Differences
| Color | Hex | Undertone | Best for |
|---|---|---|---|
| Charcoal | #36454F | Neutral to faintly warm, near-black | Grounding darks, suits, body text, dramatic walls |
| Graphite | #4D5358 | Cool metallic blue-grey | Tech and industrial finishes, dark-mode UI, sleek branding |
| Slate | #708090 | Distinct cool blue, mid-grey | Calm interiors, soft accents, UI chrome, muted palettes |
The clearest way to remember them: charcoal is darkest and most neutral, slate is lightest and bluest, and graphite sits in the middle with a cool metallic edge. Move from charcoal to slate and you get steadily lighter and steadily bluer at the same time.
Hex Codes & How to Use Each
These three sit close together, so the RGB channel relationships are what really distinguish them. Charcoal (#36454F) has low values across all channels with blue slightly leading, giving it that deep, almost-black presence with a whisper of cool. Use charcoal anywhere you would reach for black but want a softer result: it makes superb body copy at full opacity, strong headers, and grounding footer backgrounds. Against white it delivers excellent, accessible contrast.
Graphite (#4D5358) lifts all channels above charcoal while keeping blue marginally ahead, which is what produces its cool metallic read. It is a touch too light for primary body text on white if you want maximum contrast, but it excels as a UI surface color in dark interfaces, a button fill, or a section background that feels modern and engineered. In product and brand design, graphite signals precision and tech.
Slate (#708090) is noticeably lighter and the blue channel leads more clearly, which is why its blue undertone is so visible. Use slate for muted accents, secondary text on dark backgrounds, dividers, and any calm cool-toned surface. Because slate is mid-grey, pair it carefully: it does not provide strong contrast against either pure white or pure black, so treat it as a supporting tone rather than a primary text color. For warm-neutral counterpoints that balance these cool greys, the warm tones in camel vs tan vs beige pair naturally with charcoal and slate.
When to Choose Each
Choose charcoal when you want maximum depth and a grounding dark. It is the right call for suits, dramatic feature walls, primary text, and any moment where you want the authority of black with a little more softness and warmth. Charcoal anchors a palette more firmly than the other two.
Choose graphite when you want a modern, cool, slightly industrial feel. It is ideal for tech products, dark-mode interfaces, automotive and appliance finishes, and sleek minimalist branding. Its metallic undertone gives designs a precise, engineered quality that charcoal cannot quite match.
Choose slate when you want a calm, cool mid-grey with a visible blue cast. It is best for serene interiors, soft accents, UI chrome, and palettes where you want coolness without heaviness. Just remember it is the lightest of the three, so use it where contrast is not your top priority. If you are comparing other closely related dark tones, the difference between deep browns in our other guides follows the same depth-and-undertone logic.
Frequently Asked Questions
Is graphite darker than slate?
Yes. Graphite sits around #4D5358 while slate is closer to #708090, so graphite is noticeably the darker of the two. Both share a cool undertone, but graphite leans metallic blue-grey while slate has a more openly visible blue cast. Think of graphite as a deep, refined cool grey and slate as a lighter, calmer mid-grey from the same cool family.
What undertone does charcoal have?
Charcoal is broadly neutral, sitting just shy of black, though many charcoals carry a faint warm or cool cast depending on the source. Compared with graphite and slate, charcoal is the least obviously blue of the three. This neutrality is part of why charcoal works almost like a softer black, pairing easily with nearly any accent color without an undertone clash.
Which grey is best for dark-mode UI?
Graphite is often the strongest choice for dark-mode interfaces because its cool metallic undertone reads as modern and engineered while still being light enough to layer surfaces. Charcoal works well for the deepest background layer, and graphite for raised cards and panels above it. Slate is usually too light for primary dark-mode surfaces but is useful for muted secondary text.
Does slate look blue or grey?
Slate reads as a grey with a clear cool blue undertone, which is exactly why it is named after the blue-grey stone. Next to a truly neutral grey, slate’s blue becomes obvious. In warm light it softens toward neutral, and in cool light the blue intensifies, so test slate in your actual environment before committing it to walls or large surfaces.
