Carbon
A sophisticated neutral charcoal for modern interfaces
Carbon is a near-black, neutral charcoal that anchors design projects with professional restraint. Because it offers a 12.6:1 contrast ratio with white, it serves as a highly readable, softer alternative to pure black for body text and UI backgrounds. The hex code for this stable, moody grey is #333333. It pairs well with muted pastels or bright safety colors to balance complex, high-contrast interfaces.
About Carbon
Charcoal dust on a workbench at dusk
What does carbon mean?
Carbon often reads as neutral and understated. It is nearly black with zero saturation, so it feels heavy, flat, and closed off, like a room with the shades drawn.
Where you see carbon
- cast iron pans
- pencil lead
- asphalt
- camera bodies
- chalkboards
- leather jackets
What it works for
It works as a background that lets brighter colors carry the design, or as body text on light pages.
What colors go with carbon?
Linen #faf0e6The pale warm neutral lifts carbon out of its darkness without fighting it.Mustard #ffdb58Yellow ochre glows hard against this near black, giving strong warm contrast.Dusty Rose #b56f76Soft muted pink keeps the pairing quiet while warming the grey.Sage #9caf88The gray green sits at a similar dullness, so the pair feels even and calm.Burnt Orange #cc5500Rusty orange adds heat and depth to a color that has none of its own.
Questions about Carbon
What is the hex code for Carbon?
Carbon is #333333. In RGB that is rgb(51, 51, 51), in HSL hsl(0, 0%, 20%) and in CMYK 0%, 0%, 0%, 80%.
Why use #333333 instead of pure black?
Using Carbon #333333 creates a softer, more comfortable reading experience than pure black, which can often cause visual vibration against white backgrounds. This subtle reduction in contrast reduces eye strain in digital UI design while maintaining excellent legibility for long-form body text.
Which color palettes work best with Carbon #333333?
Carbon #333333 acts as a versatile anchor that balances well against vibrant safety colors like orange or yellow for high-impact alerts. It also serves as a grounding element when paired with muted, desaturated pastels like sage or dusty blue for a sophisticated, minimalist aesthetic.
Is Carbon readable on white or black?
Carbon has a 12.63:1 contrast ratio on white and 1.66:1 on black. WCAG asks for 4.5:1 for body text and 3:1 for large text, so on white it works for body text and on black it is too faint for text. Try other pairs in the contrast checker.