T
ToolPrime

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.