Golden Spring

#f49a24

#f8bb6d

#fad29e

#24f49a

#9a24f4

Actions

Explore the palette in different formats, and actions.

Colors overview

Orange

Green

Purple

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#f49a24	rgb(244, 154, 36)	hsl(34 90% 55%)	oklab(76% 0.06 0.15)	oklch(76% 0.16 66)	color(display-p3 0.91 0.62 0.26)
	#f8bb6d	rgb(248, 187, 109)	hsl(34 91% 70%)	oklab(83% 0.04 0.11)	oklch(83% 0.12 72)	color(display-p3 0.94 0.74 0.47)
	#fad29e	rgb(250, 210, 158)	hsl(34 90% 80%)	oklab(89% 0.02 0.08)	oklch(89% 0.08 74)	color(display-p3 0.96 0.83 0.65)
	#24f49a	rgb(36, 244, 154)	hsl(150 90% 55%)	oklab(85% -0.18 0.08)	oklch(85% 0.2 160)	color(display-p3 0.46 0.94 0.63)
	#9a24f4	rgb(154, 36, 244)	hsl(270 90% 55%)	oklab(56% 0.15 -0.23)	oklch(56% 0.27 300)	color(display-p3 0.56 0.18 0.92)

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

#f49a24

AA - 2.21



#f8bb6d

AA - 1.7



#fad29e

AA - 1.42



#24f49a

AA - 1.45



#9a24f4

AA - 5.33



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(76.1% 0.064 0.146), oklab(83.2% 0.037 0.113), oklab(88.6% 0.023 0.078), oklab(85.4% -0.181 0.076), oklab(56.4% 0.151 -0.228))

Fallback colors



background: linear-gradient(45deg, #f49a24, #f8bb6d, #fad29e, #24f49a, #9a24f4)

Colors



<!-- Primary Colors -->
<color name="golden_spring_color_10">#f49a24</color>
<color name="golden_spring_color_20">#f8bb6d</color>
<color name="golden_spring_color_30">#fad29e</color>
<color name="golden_spring_color_40">#24f49a</color>
<color name="golden_spring_color_50">#9a24f4</color>

PWA prompt