Espresso color guide

#3B2F2F
HEX
#3B2F2F
RGB
rgb(59, 47, 47)
HSL
hsl(0, 11%, 21%)
CMYK
cmyk(0%, 20%, 20%, 77%)

Nearly black with a warm core. One of the best alternatives to charcoal when a system should feel warm rather than technical.

Best for
Body text and dark surfaces in warm palettes.

Accessibility

Espresso text on whiteAAA
Sample12.85:1
White text on espressoAAA
Sample12.85:1
Espresso text on blackFail
Sample1.63:1
Black text on espressoFail
Sample1.63:1

Ratios follow WCAG 2.1. AA needs 4.5:1 for body text, AAA needs 7:1; large text passes AA at 3:1.

Colors that go with espresso

Combinations that hold up in a real layout rather than only on the colour wheel.

Espresso color harmonies

Complementary
The opposite hue — highest contrast, best used sparingly.
#3B2F2F #303B3B
Analogous
Neighbouring hues that sit together calmly.
#3B3036 #3B2F2F #3B3630
Triadic
Three evenly spaced hues — vivid but balanced.
#3B2F2F #303B30 #30303B
Split complementary
Softer than complementary, with the same tension.
#3B2F2F #303B36 #30363B

Espresso shades and tints

The same hue and saturation across ten lightness steps — the basis of a usable colour ramp in a design system.

#F4F1F1#DDD5D5#C6B8B8#B09C9C#998080#7F6666#634F4F#473939#2A2222#171212

Espresso FAQ

What is the hex code for espresso?

Espresso is #3B2F2F. In other formats that is rgb(59, 47, 47), hsl(0, 11%, 21%), and approximately cmyk(0%, 20%, 20%, 77%) for print.

What colors go with espresso?

Cream, Terracotta, Sage Green all pair well with espresso. Body text and dark surfaces in warm palettes.

Is espresso accessible for text?

Yes — espresso text on white reaches 12.85:1, which passes WCAG AA for body text.

Should text on espresso be black or white?

Use white text. It gives the higher contrast ratio of the two against #3B2F2F.

More brown colors