Color meaning

Chocolate Brown

Introducing Chocolate Brown (#3F2A1D), a deep, roasted shade with a warm earthiness. Its low value lets it stand in for black as a softer storefront anchor, grounding headers, navigation bars, and footers without the cold edge of pure black. That richness makes it a natural base for artisanal, heritage, and food brands.

#3F2A1DHSL 23, 37%, 18%

Chocolate Brown code conversions

HEX
#3F2A1D
RGB
rgb(63, 42, 29)
HSL
hsl(23, 37%, 18%)
HSB
hsb(23, 54%, 25%)
CMYK
cmyk(0%, 33%, 54%, 75%)

Chocolate Brown color harmonies

Analogous

Neighbors on the color wheel: a calm, low-contrast set that reads as one family.

Complementary

The hue directly opposite: maximum contrast for an accent that pops.

Split Complementary

The complement's two neighbors: strong contrast with less tension than a straight complement.

Triadic

Three hues evenly spaced: balanced and vivid without a single dominant color.

Tetradic

Two complementary pairs: a rich four-color scheme that needs one color to lead.

Square

Four hues evenly spaced: bold and balanced, best with one anchor and three accents.

Chocolate Brown contrast

Your catchy large text

Small body copy sitting on Chocolate Brown.

13.46:1White textAA passAAA pass

Your catchy large text

Small body copy sitting on Chocolate Brown.

1.4:1Black textAA failAAA fail

Chocolate Brown color variations

Shades

Mixed toward black: deeper steps for backgrounds and hover states.

Tints

Mixed toward white: softer steps for surfaces and disabled states.

Tones

Mixed toward gray: muted, sophisticated steps that lower the intensity.

Hues

Rotated around the wheel: related hues at the same lightness and saturation.

Brands that use colors like Chocolate Brown

Matched by color distance against real palettes extracted from live storefronts.

Brooklinen
#3c1f10
Gymshark
#403e3a
Faherty
#242523
Reebok
#222220
Allbirds
#222121
Rothy's
#252426
Puma
#1a1a1a

Related brown colors

Tan

Chocolate Brown: frequently asked

What color is Chocolate Brown?

Chocolate Brown (#3F2A1D) is a dark warm brown built from red and yellow undertones at low brightness. In e-commerce interfaces it reads as a soft near-black, sitting between deep espresso brown and charcoal.

What is the meaning of Chocolate Brown?

Chocolate Brown signals warmth, craft, and reliability. Brands reach for it when they want customers to feel a grounded, handmade quality while browsing, especially across food, leather, coffee, and heritage catalogs.

How do I use Chocolate Brown (#3F2A1D) in e-commerce design?

Use Chocolate Brown for structural chrome such as the header, footer, and body type, where it softens contrast against warm cream backgrounds. Pair it with a light neutral to keep long product copy legible, and reserve pure black for fine detail.

Using Chocolate Brown color codes

Copy Chocolate Brown (#3F2A1D) in HEX, RGB, HSL, HSB, and CMYK below to match it across your web store, mobile app, and packaging.

Colors are just the start

See these colors at work in real, looping storefront captures. The whole library is free to browse.

Browse the librarySee pricing

Free to browse · Pro unlocks the MCP