What are the hex codes in the Deep Warm Skin palette?

The Deep Warm Skin color palette consists of Dust #C59A84, Cocoa #8C6451, Coffee #674738, Licorice #24140C.

How should I use the Deep Warm Skin palette on a website?

Use Dust #C59A84 as the background, Licorice #24140C for text, Coffee #674738 for buttons and links, and Cocoa #8C6451 for accents. 1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Dust on Licorice at 7.06:1.

Which colors in Deep Warm Skin have enough contrast for text?

The highest-contrast pair is #C59A84 on #24140C with a ratio of 7.06:1, which passes WCAG AA for normal text.

#C59A84Dust

#8C6451Cocoa

#674738Coffee

#24140CLicorice

Deep Warm Skin color palette

Skin Tone Dark Muted Warm Minimal Earthy Beige Brown Black

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Dust	`#C59A84`	`rgb(197, 154, 132)`	`hsl(20, 36%, 65%)`	`oklch(72.0% 0.060 48)`
Cocoa	`#8C6451`	`rgb(140, 100, 81)`	`hsl(19, 27%, 43%)`	`oklch(54.0% 0.060 46)`
Coffee	`#674738`	`rgb(103, 71, 56)`	`hsl(19, 30%, 31%)`	`oklch(42.9% 0.050 46)`
Licorice	`#24140C`	`rgb(36, 20, 12)`	`hsl(20, 50%, 9%)`	`oklch(21.1% 0.030 47)`

Why it works and how to use it

Deep Warm Skin is a dark, monochromatic color palette tagged skin tone, dark, muted. All four colors sit within 1° of hue, so the scheme reads as one color explored across light and dark. Neither washed out nor loud, it adapts to most contexts. The overall temperature is warm.

With 4 chromatic colors, Coffee takes the lead while the rest support. Lightness runs from 9% to 65%. Well suited to wellness, organic and outdoor brands.

Background: Dust (#C59A84) is the lightest color, so it belongs on large surfaces.
Text: Licorice (#24140C) on #C59A84 gives 7.06:1, passing WCAG AAA.
Primary: Coffee (#674738) is the most saturated mid-tone; use it for buttons and links (3.29:1 against the background, fine for UI elements).
Accent: Cocoa (#8C6451) for highlights, badges and hover states.

1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Dust on Licorice at 7.06:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Deep Warm Skin

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

#C59A84

#8C6451

#674738

#24140C

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
`#C59A84` on `#24140C`	Aa	7.06:1	AAA
`#8C6451` on `#24140C`	Aa	3.44:1	AA large only
`#C59A84` on `#674738`	Aa	3.29:1	AA large only
`#674738` on `#24140C`	Aa	2.15:1	Fail
`#C59A84` on `#8C6451`	Aa	2.05:1	Fail
`#8C6451` on `#674738`	Aa	1.6:1	Fail

Similar palettes 24 more in this mood