Golden

#46310e

#714e17

#9b6c20

#c68928

#f0a731

Actions

Explore the palette in different formats, and actions.

Colors overview

Yellow

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#46310e	rgb(70, 49, 14)	hsl(38 67% 16%)	oklab(33% 0.01 0.06)	oklch(33% 0.06 77)	color(display-p3 0.26 0.2 0.08)
	#714e17	rgb(113, 78, 23)	hsl(37 66% 27%)	oklab(45% 0.02 0.08)	oklch(45% 0.08 74)	color(display-p3 0.42 0.31 0.13)
	#9b6c20	rgb(155, 108, 32)	hsl(37 66% 37%)	oklab(57% 0.03 0.1)	oklch(57% 0.11 75)	color(display-p3 0.58 0.43 0.19)
	#c68928	rgb(198, 137, 40)	hsl(37 66% 47%)	oklab(68% 0.04 0.12)	oklch(68% 0.13 74)	color(display-p3 0.74 0.55 0.24)
	#f0a731	rgb(240, 167, 49)	hsl(37 86% 57%)	oklab(78% 0.04 0.14)	oklch(78% 0.15 74)	color(display-p3 0.9 0.67 0.3)

 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.

#46310e

AAA - 12.3



#714e17

AAA - 7.48



#9b6c20

AA - 4.6



#c68928

AA - 2.99



#f0a731

AA - 2.04



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(33% 0.013 0.056), oklab(45.2% 0.023 0.08), oklab(56.7% 0.028 0.103), oklab(67.5% 0.036 0.124), oklab(78% 0.041 0.145))

Fallback colors



background: linear-gradient(45deg, #46310e, #714e17, #9b6c20, #c68928, #f0a731)

Colors



<!-- Primary Colors -->
<color name="golden_color_10">#46310e</color>
<color name="golden_color_20">#714e17</color>
<color name="golden_color_30">#9b6c20</color>
<color name="golden_color_40">#c68928</color>
<color name="golden_color_50">#f0a731</color>

PWA prompt