Mocha

#6D3B07

What color is Mocha?

Mocha is a warm, dark brown with reddish undertones, hex #6D3B07, close to the color of roasted coffee beans. The tone is deep and earthy, with enough red in it to keep it from looking flat or neutral.

What is the meaning of the color Mocha?

The port city of Mocha in Yemen gave this color its name, having exported prized arabica coffee beans across the Middle East and Europe from the 15th century onward. By the 17th century, Mocha coffee was a luxury trade good reaching European markets, and the rich brown associated with its roasted beans entered the decorative vocabulary of interiors and textiles. The color gained wider recognition as a design and fashion term in the 20th century, used by manufacturers to describe warm brown upholstery, paint, and clothing. Benjamin Moore included Mocha in its named paint palette, anchoring the term as a standard interior color reference.

RGB
109, 59, 7
HSL
31°, 88%, 23%
CMYK
0, 46, 94, 57
HSV
31°, 94%, 43%
Mocha color

What colors go with Mocha?

Colors that pair well with Mocha include:
Cream: soft, warm contrast
Terracotta: earthy tonal depth
Olive Green: grounded, natural balance
Dusty Rose: warm, gentle complement
Charcoal: strong, anchoring contrast

Similar Colors

Conversions & Codes

Format Value CSS
HEX #6D3B07 color: #6D3B07;
RGB 109, 59, 7 color: rgb(109, 59, 7);
RGB Percentage 43%, 23%, 3% color: rgb(43%, 23%, 3%);
CMYK 0%, 46%, 94%, 57% Not supported in CSS
HSL 31°, 88%, 23% color: hsl(31, 88%, 23%);
HSV 31°, 94%, 43% Not supported in CSS
CIE-LAB 18, 10, 17 color: lab(18% 10 17);
Decimal 7158535 Not supported in CSS

Color Variations

Shades

#6E3C07
#633606
#583006
#4D2A05
#422404
#371E04
#2C1803
#211202

Tints

#F8C690
#F6B36B
#F3A046
#F18D22
#DD790E
#B8650C
#935109
#6E3C07

Tones

#6E3C07
#693C0C
#643C11
#5F3C17
#5A3C1C
#543C21
#4F3B26
#4A3B2B

Hues

#6E3C07
#536E07
#076E09
#076E56
#07396E
#23076E
#6E076D
#6E071F

Color Harmonies

Analogous

#6E0907
Click to copy
#6D3B07
Click to copy
100%
#6D6E07
Click to copy

Complementary

#6D3B07
Click to copy
100%
#07396E
Click to copy

Split Complementary

#6D3B07
Click to copy
100%
#076D6E
Click to copy
#09076E
Click to copy

Triadic

#6D3B07
Click to copy
100%
#076E3C
Click to copy
#3C076E
Click to copy

Tetradic

#6D3B07
Click to copy
100%
#076E09
Click to copy
#07396E
Click to copy
#6E076D
Click to copy

Square

#6D3B07
Click to copy
100%
#076E09
Click to copy
#07396E
Click to copy
#6E076D
Click to copy

CSS & Dev Snippets

CSS
.mocha {
  color: #6D3B07;
}
SCSS
$mocha: #6D3B07;
RGB
rgb(109, 59, 7)

Accessibility & Contrast

White background

9.21:1
9.21
contrast ratio on a white background
Element
AA
AAA
Small text
Large text
UI element

Black background

2.28:1
2.28
contrast ratio on a black background
Element
AA
AAA
Small text
Large text
UI element

Popular Tags