Explore the most common shades of brown with their hex codes. Find the perfect brown for your next design project.
From the deepest, most saturated tones to the lightest pastels, brown appears in nearly every design discipline — branding, interiors, fashion, and digital UI. The 30 shades below are the most commonly used named variants of brown, each with a precise hex code you can copy directly into your design tool.
Looking for the right pairing? See colors that go with brown. Need a different format? Try our format converters for HEX, RGB, HSL, OKLCH, and CMYK.
Chocolate
#7B3F00
Coffee
#6F4E37
Tan
#D2B48C
Sienna
#A0522D
Umber
#635147
Mocha
#967969
Chestnut
#954535
Mahogany
#C04000
Cinnamon
#D2691E
Walnut
#773F1A
Caramel
#FFD59A
Saddle Brown
#8B4513
Burnt Sienna
#E97451
Cocoa
#D2691E
Espresso
#3C1414
Auburn
#A52A2A
Sepia
#704214
Taupe
#483C32
Sandy Brown
#F4A460
Khaki
#C3B091
Fawn
#E5AA70
Beaver
#9F8170
Copper
#B87333
Russet
#80461B
Bronze
#CD7F32
Peru
#CD853F
Bistre
#3D2B1F
Chamoisee
#A0785A
Raw Umber
#826644
Dark Brown
#654321
Featured shade
Chocolate is the canonical brown in this collection. Below is its full breakdown across every common color format — useful when you need the same color in CSS, a design tool, or a print workflow.
Brown is essentially a desaturated orange or red, so its complements lean blue. The safest pairings are warm whites (cream, ivory, bone) and natural greens (sage, olive, forest).
Download Colorframe to pick any shade of brown from your screen and get instant hex, RGB, HSL, OKLCH, and CMYK values.