Codes & values
- Color Name
Charcoal - Color ID
KDF-C-02042167 - HEX
#1F2937 - RGB
rgb(31, 41, 55) - RGBA
rgba(31, 41, 55, 1) - HSL
hsl(215, 28%, 17%) - HSLA
hsla(215, 28%, 17%, 1) - HSV / HSB
hsv(215, 44%, 22%) - CMYK
cmyk(44%, 25%, 0%, 78%) - Light / Dark
dark
Quick answers
- What is the HEX code for Charcoal?
- #1F2937
- What is Charcoal RGB?
- rgb(31, 41, 55)
- What is Charcoal HSL?
- hsl(215, 28%, 17%)
- What is Charcoal CMYK?
- cmyk(44%, 25%, 0%, 78%)
What is Charcoal?
Charcoal is a curated blue family color at #1F2937. It appears in our library with tags for ui, branding, design, web. This shade classifies as dark — strong for text, dark-mode surfaces, or dramatic branding. Temperature lean: cool — calmer, often used for tech, healthcare, and finance trust..
Charcoal HEX code
The HEX code for Charcoal is #1F2937. Paste it into CSS as color: #1F2937; or background-color: #1F2937;. Design tools accept the same six-digit value without the # prefix (1f2937).
Charcoal RGB
Charcoal in RGB is rgb(31, 41, 55) (channels R 31, G 41, B 55). Use RGB when you need opacity via rgba(31, 41, 55, 1).
Charcoal HSL & HSV
HSL is hsl(215, 28%, 17%) — useful for generating lighter/darker variants by adjusting lightness. HSV/HSB is hsv(215, 44%, 22%), closer to how many digital pickers expose hue, saturation, and brightness.
Charcoal CMYK
Approximate CMYK for Charcoal is cmyk(44%, 25%, 0%, 78%). Screen HEX/RGB values are device-dependent; for print, always soft-proof in your print profile rather than relying on a web conversion alone.
Shades of Charcoal
Darker shades (mixed toward black): #1A222E, #151B25, #10151C, #0A0E12, #050709. Use deeper shades for hover states, borders, and dark-mode accents.
Tints of Charcoal
Lighter tints (mixed toward white): #444D58, #6A707A, #8F949B, #B4B8BC, #DADBDE. Tints work well for soft backgrounds, chips, and secondary buttons.
Colors that go with Charcoal
Complementary pairing: #1F2937, #372D1F. Analogous neighbors: #1F3537, #1F2937, #211F37. Triadic accents: #1F2937, #371F29, #29371F. Always check text contrast when pairing.
Charcoal color combinations
A practical combo: primary #1F2937, complementary accent #372D1F, and a neutral charcoal or off-white for text and surfaces. Split-complementary options: #1F2937, #37211F, #35371F.
Charcoal in web design
Blue remains the default trust color for SaaS, finance, and health UI. Royal and navy blues anchor headers; sky blues soften backgrounds and links.
Charcoal in branding
Brand blues communicate reliability. Royal blue and navy remain corporate staples; electric blue reads more startup. Contrast vs white is 14.68:1 (passes WCAG AA for normal text); vs black 1.43:1.
Frequently asked questions
- What is the HEX code for Charcoal?
- Charcoal: #1F2937.
- What is Charcoal RGB?
- Charcoal: rgb(31, 41, 55).
- What is Charcoal HSL?
- Charcoal: hsl(215, 28%, 17%).
- What is Charcoal CMYK?
- Charcoal: cmyk(44%, 25%, 0%, 78%).
- What colors go with Charcoal?
- Try complementary #1F2937, #372D1F or analogous #1F3537, #1F2937, #211F37.
- Is Charcoal good for text on white?
- Yes — contrast 14.68:1 meets WCAG AA for normal text.
Accessibility snapshot
Contrast vs white: 14.68:1 (AA body text pass). Contrast vs black: 1.43:1. Complementary swatch: #1F2937, #372D1F.
Explore related
Blue colorsColor pickerPalette generatorContrast checkerColor guidesComplete Color Code GuideHow HEX Colors WorkHEX vs RGB vs CMYK