Cocoa color

A medium chocolate brown named after cocoa powder made from roasted cacao beans. It is warm, comforting and easy to pair, so it is common in sweaters, bedding and coffee shop branding.

Also known as: Cocoa brown.

Open in editor

The hex code for cocoa is #875F42. In RGB it is rgb(135, 95, 66), in HSL hsl(25, 34%, 39%) and in CMYK 0, 30, 51, 47.

See it in real life

Pick a color to pair it with and see how it looks on clothes, interiors and design.

Colors similar to cocoa

Raw umber#826644 Pecan#8E5B3A Toffee#755139 Tobacco brown#71563B Coffee brown#6F4E37 Cappuccino#A57B5B

About cocoa

Cocoa (#875F42) is a warm, mid-tone, moderately saturated color. It belongs to the browns family. It mixes 135 red, 95 green and 66 blue (out of 255). It is mostly used in fashion, home decor, branding.

Swatch of Cocoa with its shades from light to dark · #875F42 — Cocoa · #875F42

Cocoa shades and tints

From lightest to darkest. Tap a shade to copy its code.

See all its shades: Color shades generator

Cocoa outfits: palettes by season

Outfit palettes with cocoa or a very close shade, each with 8 outfits to copy.

BohoFall · Men BohoSpring · Men

Cocoa color harmonies

Combinations based on the color wheel. More in the color harmony tool.

ComplementaryClose to: Payne's gray

AnalogousClose to: Cordovan, Moss green

TriadicClose to: Sea green, Ultra violet

Split complementaryClose to: Teal, Ultra violet

TetradicClose to: Fern green, Payne's gray, Plum

Cocoa color palettes

Copy the codes or open a palette in the editor to tweak it.

Monochromatic palette · Cocoa

Analogous palette · Cocoa

Complementary palette · Cocoa

Triadic palette · Cocoa

With neutrals palette · Cocoa

With an accent palette · Cocoa

Cocoa contrast with text

White textContrast 5.6:1 · AA

Black textContrast 3.7:1 · AA large text

Based on WCAG 2.1 guidelines. Test other pairs in the contrast checker.

CSS code

:root {
  --cocoa: #875F42;
  --cocoa-rgb: 135, 95, 66;
}
.bg { background-color: var(--cocoa); }
.text { color: var(--cocoa); }

Colors similar to cocoa

Café au lait Mocha Leather brown Dark brown

Themed palettes with this color

More browns

Brown Coffee brown Chocolate brown Mahogany Chestnut Cinnamon Sepia Ochre Caramel Camel Mocha Khaki Sand Beige Nude Bronze Tobacco brown Sienna Café au lait Tan Cognac Espresso Walnut Burnt umber

Try this next

Name color paletteType a name and get your own color story palette What color is your voice?Speak for 5 seconds and turn your voice into a color 16 personality type colorsTake an 8-question quiz and get your image color

See all free tools →

Frequently asked questions

What is the hex code for cocoa?

The hex code for cocoa is #875F42. In RGB it is rgb(135, 95, 66), in HSL hsl(25, 34%, 39%) and in CMYK 0, 30, 51, 47.

What is the complementary color of cocoa?

Its complement on the color wheel is #426A87, close to payne's gray. Used in small doses, it works as an accent and adds strong contrast.

Can you use white text on cocoa?

Yes. The contrast with white is 5.6:1, enough for body text (WCAG AA).