What are the hex codes in the Worn Espresso & Coffee palette?

The Worn Espresso & Coffee color palette consists of Espresso #472B23, Coffee #705348, Pewter #A6948F, Fog #CECAC8.

How should I use the Worn Espresso & Coffee palette on a website?

Use Fog #CECAC8 as the background, Espresso #472B23 for text, Coffee #705348 for buttons and links, and Pewter #A6948F for accents. 1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Espresso on Fog at 7.88:1.

Which colors in Worn Espresso & Coffee have enough contrast for text?

The highest-contrast pair is #472B23 on #CECAC8 with a ratio of 7.88:1, which passes WCAG AA for normal text.

#472B23Espresso

#705348Coffee

#A6948FPewter

#CECAC8Fog

Worn Espresso & Coffee color palette

Earthy Muted Minimal Brown Gray

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Espresso	`#472B23`	`rgb(71, 43, 35)`	`hsl(13, 34%, 21%)`	`oklch(32.2% 0.044 37)`
Coffee	`#705348`	`rgb(112, 83, 72)`	`hsl(17, 22%, 36%)`	`oklch(47.0% 0.043 42)`
Pewter	`#A6948F`	`rgb(166, 148, 143)`	`hsl(13, 11%, 61%)`	`oklch(68.1% 0.023 36)`
Fog	`#CECAC8`	`rgb(206, 202, 200)`	`hsl(20, 6%, 80%)`	`oklch(84.2% 0.005 49)`

Why it works and how to use it

Worn Espresso & Coffee is a muted monochromatic color palette tagged earthy, muted, minimal. All four colors sit within 4° of hue, so the scheme reads as one color explored across light and dark. Every color is softened, so it works well as a background system for text-heavy layouts. The overall temperature is warm.

It works because the lightness range is wide (21% to 80%), which gives clear hierarchy between background, content and accents. Try it for wellness, organic and outdoor brands.

Background: Fog (#CECAC8) is the lightest color, so it belongs on large surfaces.
Text: Espresso (#472B23) on #CECAC8 gives 7.88:1, passing WCAG AAA.
Primary: Coffee (#705348) is the most saturated mid-tone; use it for buttons and links (4.27:1 against the background, fine for UI elements).
Accent: Pewter (#A6948F) for highlights, badges and hover states.

1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Espresso on Fog at 7.88:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Worn Espresso & Coffee

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary

Card title

Roles are assigned by lightness.

Color blindness simulation

#472B23

#705348

#A6948F

#CECAC8

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#472B23` on `#CECAC8`	Aa	7.88:1	AAA
`#472B23` on `#A6948F`	Aa	4.43:1	AA large only
`#705348` on `#CECAC8`	Aa	4.27:1	AA large only
`#705348` on `#A6948F`	Aa	2.4:1	Fail
`#472B23` on `#705348`	Aa	1.84:1	Fail
`#A6948F` on `#CECAC8`	Aa	1.78:1	Fail

Similar palettes 24 more in this mood