Clay Brown Color Palette
A grounded brown palette inspired by natural clay. Ideal for coffee brands, leather goods, and rustic designs.
Espresso
HEX: #4a3728
RGB: rgb(74, 55, 40)
HSL: hsl(26, 30%, 22%)
Rich Brown
HEX: #6d523e
RGB: rgb(109, 82, 62)
HSL: hsl(26, 27%, 34%)
Clay Brown
HEX: #8d6e54
RGB: rgb(141, 110, 84)
HSL: hsl(27, 25%, 44%)
Tan
HEX: #b39980
RGB: rgb(179, 153, 128)
HSL: hsl(29, 25%, 60%)
Light Clay
HEX: #dcc7b5
RGB: rgb(220, 199, 181)
HSL: hsl(28, 36%, 79%)
CSS Variables
:root {
--clay-brown-1: #4a3728;
--clay-brown-2: #6d523e;
--clay-brown-3: #8d6e54;
--clay-brown-4: #b39980;
--clay-brown-5: #dcc7b5;
} Tailwind CSS Config
// tailwind.config.js
module.exports = {
theme: {
extend: {
colors: {
'clay-brown': {
'100': '#4a3728',
'200': '#6d523e',
'300': '#8d6e54',
'400': '#b39980',
'500': '#dcc7b5',
},
},
},
},
} Use Cases
Coffee shops
Leather goods
Rustic restaurants
Craft breweries
Related Palettes
Frequently Asked Questions
Is brown a good color for branding?▾
Brown conveys reliability, warmth, and earthiness. Brands like UPS, M&Ms, and Hershey use brown successfully to communicate quality and dependability.
How do I modernize a brown palette?▾
Combine brown with clean white space, modern typography, and strategic accent colors like teal or gold. Avoid heavy textures that can date the design.