What are the hex codes in the Honey Oat palette?

The Honey Oat color palette consists of Cocoa #7F5539, Hazelnut #B08968, Tan #DDB892, Almond #EDE0D4.

How should I use the Honey Oat palette on a website?

Use Almond #EDE0D4 as the background, Cocoa #7F5539 for text, Tan #DDB892 for buttons and links, and Hazelnut #B08968 for accents. 1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Cocoa on Almond at 4.97:1.

Which colors in Honey Oat have enough contrast for text?

The highest-contrast pair is #7F5539 on #EDE0D4 with a ratio of 4.97:1, which passes WCAG AA for normal text.

#7F5539Cocoa

#B08968Hazelnut

#DDB892Tan

#EDE0D4Almond

Honey Oat color palette

Coffee Skin Muted Warm Earthy Brown Gray

Open in generator

Ask AI about this palette: ChatGPT Claude Perplexity

Honey Oat is a monochromatic color palette tagged coffee, skin, muted. All four colors sit within 6° 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.

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Cocoa	`#7F5539`	`rgb(127, 85, 57)`	`hsl(24, 38%, 36%)`	`oklch(48.9% 0.070 54)`
Hazelnut	`#B08968`	`rgb(176, 137, 104)`	`hsl(27, 31%, 55%)`	`oklch(65.9% 0.066 62)`
Tan	`#DDB892`	`rgb(221, 184, 146)`	`hsl(30, 52%, 72%)`	`oklch(80.6% 0.066 67)`
Almond	`#EDE0D4`	`rgb(237, 224, 212)`	`hsl(29, 41%, 88%)`	`oklch(91.4% 0.022 65)`

Why it works and how to use it

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

Pair	Sample	Ratio	Level
`#7F5539` on `#EDE0D4`	Aa	4.97:1	AA
`#7F5539` on `#DDB892`	Aa	3.48:1	AA large only
`#B08968` on `#EDE0D4`	Aa	2.45:1	Fail
`#7F5539` on `#B08968`	Aa	2.03:1	Fail
`#B08968` on `#DDB892`	Aa	1.71:1	Fail
`#DDB892` on `#EDE0D4`	Aa	1.43:1	Fail

Honey Oat color palette

Color codes click any value to copy

Why it works and how to use it

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

Design faster with Honey Oat

Color blindness simulation

Contrast check WCAG ratios between palette colors

Similar palettes 24 more in this mood