Color code and palette
Shades of Brown
Brown brings material warmth and stability to digital palettes. Sand, caramel and espresso values work naturally with cream, green and muted orange in tactile or heritage-inspired systems.
Brown #A16207
Color formats
The same base color in common web formats.
HEX
#A16207 RGB
rgb(161, 98, 7) HSL
hsl(35, 92%, 33%) OKLCH
oklch(55.0% 0.121 66.0) Brown brings material warmth and stability to digital palettes. Sand, caramel and espresso values work naturally with cream, green and muted orange in tactile or heritage-inspired systems.
Shades
| Color | Name | Hex | |
|---|---|---|---|
| Cream | #FFFBEB | ||
| Vanilla | #FEF3C7 | ||
| Beige | #FDE68A | ||
| Sand | #FCD34D | ||
| Tan | #FBBF24 | ||
| Camel | #F59E0B | ||
| Amber | #D97706 | ||
| Bronze | #B45309 | ||
| Brown | #92400E | ||
| Dark Brown | #78350F | ||
| Sepia Light | #FEF2F2 | ||
| Blush Brown | #FEE2E2 | ||
| Taupe Light | #FECACA | ||
| Taupe | #FCA5A5 | ||
| Cocoa | #F87171 | ||
| Terracotta | #EF4444 | ||
| Rust | #DC2626 | ||
| Brick | #B91C1C | ||
| Mahogany | #991B1B | ||
| Espresso | #7F1D1D |
Triadic color harmony
Three evenly spaced hues create a colorful but balanced starting palette.
Text contrast
These ratios use the WCAG relative luminance formula.
White textNaN:1
Black textNaN:1
Ways to use brown
01
Food, craft and heritage brands
02
Natural product packaging
03
Warm backgrounds and typography accents