Chocolate color: code #7B3F00

Chocolate

#7B3F00

Color codes

  • HEX#7B3F00
  • RGBrgb(123, 63, 0)
  • HSLhsl(31, 100%, 24%)
  • HSVhsv(31, 100%, 48%)
  • CMYKcmyk(0%, 49%, 100%, 52%)
  • LABlab(33.5% 22.3 43.8)
  • OKLCHoklch(43.5% 0.105 57)

About the color Chocolate

Chocolate has the HEX code #7B3F00, which corresponds to rgb(123, 63, 0) in the RGB model. On the color wheel its hue sits at 31°, with 100% saturation and 24% lightness (hsl(31, 100%, 24%)).

Because of its hue it reads as a warm color: it tends to feel energetic and close, and it visually “advances” in a composition.

As a background it calls for light text: white reaches a 8.22:1 contrast ratio on it, versus 2.55:1 for black.

For print, the approximate conversion is cmyk(0%, 49%, 100%, 52%). Always confirm with your printer’s color profile, because the result depends on paper and ink.

Lighter tints

Darker shades

Color combinations with Chocolate

Complementary

#7B3F00 · #003B7A

Analogous

#7A0200 · #7B3F00 · #787A00

Triadic

#7B3F00 · #007A3F · #3F007A

Tetradic

#7B3F00 · #007A02 · #003B7A · #7A0078

Split-complementary

#7B3F00 · #00787A · #02007A

Monochromatic

#000000 · #472500 · #7B3F00 · #C76700 · #FF8E14

Chocolate with white and black text

White text Aa Bb Cc 123
8.22:1 · AAA
Black text Aa Bb Cc 123
2.55:1 · fails WCAG

Test other pairs in the contrast checker

How to use it in CSS

:root {
  --color-chocolate: #7B3F00;
  --color-chocolate-rgb: 123, 63, 0;
}

.elemento {
  background-color: var(--color-chocolate);
  color: #FFFFFF;
}