Yellow Shades

#2f2a17

#5a4f2c

#847541

#af9a56

#d9c06b

Actions

Explore the palette in different formats, and actions.

Colors overview

Yellow

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#2f2a17	rgb(47, 42, 23)	hsl(47 34% 14%)	oklab(28% 0 0.03)	oklch(28% 0.03 95)	color(display-p3 0.18 0.17 0.1)
	#5a4f2c	rgb(90, 79, 44)	hsl(46 34% 26%)	oklab(43% 0 0.05)	oklch(43% 0.05 93)	color(display-p3 0.35 0.31 0.19)
	#847541	rgb(132, 117, 65)	hsl(47 34% 39%)	oklab(56% 0 0.07)	oklch(56% 0.07 94)	color(display-p3 0.51 0.46 0.28)
	#af9a56	rgb(175, 154, 86)	hsl(46 36% 51%)	oklab(69% 0 0.09)	oklch(69% 0.09 93)	color(display-p3 0.67 0.61 0.37)
	#d9c06b	rgb(217, 192, 107)	hsl(46 59% 64%)	oklab(81% -0.01 0.11)	oklch(81% 0.11 93)	color(display-p3 0.83 0.76 0.47)

 Click on a color value to copy it to your clipboard.

Contrast ratios checker

Click one color card to view the complete contrast checker tests.

#2f2a17

AAA - 14.34



#5a4f2c

AAA - 8.1



#847541

AA - 4.56



#af9a56

AA - 2.77



#d9c06b

AA - 1.79



Color blindness

The simulation of color blindness may not be 100% accurate sometimes.

Colors preview as gradient with protanopia

Colors preview as palette with protanopia

UI components preview

Preview the gradient in different UI components.

HDR color space

HDR oklab colors



background: linear-gradient(45deg, oklab(28.5% -0.003 0.032), oklab(43% -0.002 0.054), oklab(56.4% -0.005 0.073), oklab(69% -0.004 0.091), oklab(81.1% -0.006 0.109))

Fallback colors



background: linear-gradient(45deg, #2f2a17, #5a4f2c, #847541, #af9a56, #d9c06b)

Colors



<!-- Primary Colors -->
<color name="yellow_shades_color_10">#2f2a17</color>
<color name="yellow_shades_color_20">#5a4f2c</color>
<color name="yellow_shades_color_30">#847541</color>
<color name="yellow_shades_color_40">#af9a56</color>
<color name="yellow_shades_color_50">#d9c06b</color>

PWA prompt