Recolorify
Sign inStart free →
DESIGN10 min read· Jun 22, 2026

The Ultimate Guide to Brown Color Codes, Hex Codes, and Shades of Brown

Brown is the color of warmth, craft, and natural materials — it anchors leather goods, coffee, furniture, and earthy, organic brands. It is also one of the most material-dependent hues: brown leather, wood, and fabric each read differently. Whether you are a web designer matching co-brand assets, an e-commerce manager building variant listings, or a developer wiring up a design system, color codes are your shared language. In this guide we break down the hex codes, RGB coordinates, and LAB parameters for the most popular shades of brown, with practical tips on recoloring assets into these exact tones without quality loss.

The Ultimate Guide to Brown Color Codes, Hex Codes, and Shades of Brown

The core browns and their codes

Interactive Brown Swatch Grid

Click any swatch to copy its Hex code to your clipboard and view its RGB/HSL conversions.

Pure brown

a warm mid brown.

Selected color: #964B00

Brown in RGB, HSL, and CMYK

Brown has no single primary — it is a dark, desaturated orange-red, so #964B00 is RGB(150, 75, 0). That is why brown is easy to get muddy.

For pure brown #964B00: RGB(150, 75, 0), HSL(30°, 100%, 29%), CMYK(0%, 50%, 100%, 41%). For chocolate #7B3F00: RGB(123, 63, 0), HSL(31°, 100%, 24%), CMYK(0%, 49%, 100%, 52%). The high black component (K) is what makes browns read as deep and earthy.

Why hex alone isn't enough for recoloring

A hex code defines a target color, but it says nothing about lightness. Brown is a low-lightness mix of red, orange, and yellow, so a flat RGB swap muddies the grain of wood or leather and flattens the highlights that make those materials look real.

This is why perceptually-uniform spaces matter. LAB separates lightness (the L channel — grain, folds, highlights, shadows) from the color itself (A and B). Recoloring in LAB lets you hit an exact brown hex while the wood grain or leather texture survives intact.

Matching brand browns across assets

Brown shifts dramatically with material and lighting — a tan bag in studio light and the same tan in a hex swatch can look like two colors, so locking to an exact value matters. Define each brand brown once — with a name, a hex, and a use case — and recolor every asset to that exact value rather than eyeballing it.

With Recolorify you can paste an exact brown hex and recolor a logo, a product photo, or a bag to match it precisely, keeping texture intact. See also our guides to beige color codes and gold color codes.

Best color pairings for brown

  • Brown + cream (#FAF3E0) — warm, organic, and inviting for craft and hospitality.
  • Brown + sage green (#9CAF88) — earthy and natural for wellness and outdoor brands.
  • Brown + gold (#D4AF37) — rich and premium for leather goods and spirits.
  • Brown + white (#FFFFFF) — clean and modern, keeps earthy tones from feeling heavy.
  • Brown + burnt orange (#CC5500) — a cozy, autumnal, tonal palette.

Frequently asked questions about brown color codes

What is the hex code for brown? A common pure brown is #964B00. The CSS keyword "brown" is actually #A52A2A, which reads more red than most people expect.

What is the RGB code for brown? Pure brown is RGB(150, 75, 0); chocolate is RGB(123, 63, 0).

What is the difference between tan and beige? Tan (#D2B48C) is a deeper, sandier brown; beige (#F5F5DC) is paler and more neutral. See our dedicated beige color codes guide.

What is the hex code for chocolate brown? Chocolate is #7B3F00 — a deep, rich brown (the CSS "chocolate" keyword is a lighter #D2691E).