What are the hex codes in the Sunny Honey & Saffron palette?

The Sunny Honey & Saffron color palette consists of Pearl #E5DFCA, Saffron #E2C846, Honey #D69D00, Raisin #232323.

How should I use the Sunny Honey & Saffron palette on a website?

Use Pearl #E5DFCA as the background, Raisin #232323 for text, Honey #D69D00 for buttons and links, and Saffron #E2C846 for accents. 3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Pearl on Raisin at 11.78:1.

Which colors in Sunny Honey & Saffron have enough contrast for text?

The highest-contrast pair is #E5DFCA on #232323 with a ratio of 11.78:1, which passes WCAG AA for normal text.

#E5DFCAPearl

#E2C846Saffron

#D69D00Honey

#232323Raisin

Sunny Honey & Saffron color palette

Happy Warm Gray Yellow

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Pearl	`#E5DFCA`	`rgb(229, 223, 202)`	`hsl(47, 34%, 85%)`	`oklch(90.3% 0.029 94)`
Saffron	`#E2C846`	`rgb(226, 200, 70)`	`hsl(50, 73%, 58%)`	`oklch(83.2% 0.147 98)`
Honey	`#D69D00`	`rgb(214, 157, 0)`	`hsl(44, 100%, 42%)`	`oklch(73.1% 0.150 82)`
Raisin	`#232323`	`rgb(35, 35, 35)`	`hsl(0, 0%, 14%)`	`oklch(25.6% 0.000 0)`

Why it works and how to use it

Sunny Honey & Saffron is a monochromatic color palette tagged happy, warm, gray. A monochromatic set: the same hue family from Raisin down to Pearl. Saturation is moderate, which keeps it flexible for both interfaces and print. The overall temperature is warm.

With 3 chromatic colors, Honey takes the lead while the rest support. Lightness runs from 14% to 85%. Well suited to websites, presentations and branding.

Background: Pearl (#E5DFCA) is the lightest color, so it belongs on large surfaces.
Text: Raisin (#232323) on #E5DFCA gives 11.78:1, passing WCAG AAA.
Primary: Honey (#D69D00) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Saffron (#E2C846) for highlights, badges and hover states.

3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Pearl on Raisin at 11.78:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Sunny Honey & Saffron

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

#E5DFCA

#E2C846

#D69D00

#232323

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
`#E5DFCA` on `#232323`	Aa	11.78:1	AAA
`#E2C846` on `#232323`	Aa	9.42:1	AAA
`#D69D00` on `#232323`	Aa	6.5:1	AA
`#E5DFCA` on `#D69D00`	Aa	1.81:1	Fail
`#E2C846` on `#D69D00`	Aa	1.45:1	Fail
`#E5DFCA` on `#E2C846`	Aa	1.25:1	Fail

Similar palettes 24 more in this mood