Charcoal Color Palette
A sophisticated charcoal palette for dark-mode and high-contrast designs. Perfect for tech, photography, and luxury.
Ink Black
HEX: #1a1a2e
RGB: rgb(26, 26, 46)
HSL: hsl(240, 28%, 14%)
Dark Charcoal
HEX: #2a3440
RGB: rgb(42, 52, 64)
HSL: hsl(213, 21%, 21%)
Charcoal
HEX: #36454f
RGB: rgb(54, 69, 79)
HSL: hsl(204, 19%, 26%)
Medium Gray
HEX: #5a6c7a
RGB: rgb(90, 108, 122)
HSL: hsl(206, 15%, 42%)
Cool Gray
HEX: #8fa4b2
RGB: rgb(143, 164, 178)
HSL: hsl(204, 19%, 63%)
CSS Variables
:root {
--charcoal-1: #1a1a2e;
--charcoal-2: #2a3440;
--charcoal-3: #36454f;
--charcoal-4: #5a6c7a;
--charcoal-5: #8fa4b2;
}Tailwind CSS Config
// tailwind.config.js
module.exports = {
theme: {
extend: {
colors: {
'charcoal': {
'100': '#1a1a2e',
'200': '#2a3440',
'300': '#36454f',
'400': '#5a6c7a',
'500': '#8fa4b2',
},
},
},
},
}Use Cases
Dark mode UIs
Photography portfolios
Luxury brands
Tech products
Related Palettes
Frequently Asked Questions
Why use charcoal instead of pure black?▾
Charcoal is softer than pure black, reducing eye strain and creating a more sophisticated look. It also allows dark-on-dark layering that pure black cannot achieve.
What accent colors work with charcoal?▾
Nearly any bright accent works with charcoal: teal, coral, gold, electric blue, and lime green all pop beautifully against charcoal backgrounds.