#F39C19

#ffba52

#ffd494

#9effc6

#39dbad

Play

#F39C19

#ffba52

#ffd494

#9effc6

#39dbad



Web code

Get CSS, SCSS, & Tailwind code for development



App tokens

Get Android, Flutter, Swift, & MAUI tokens



Quick view

Inspect colors in multiple color spaces

Colors overview

Orange

Cyan

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#f39c19	rgb(243, 156, 25)	hsl(36 90% 53%)	hwb(36 9.8% 4.7%)	lch(72.1 77.4 69.4)	lab(72.1 27.2 72.5)	cmyk 0%, 36%, 90%, 5%
	#ffba52	rgb(255, 186, 82)	hsl(36 100% 66%)	hwb(36 32% 0%)	lch(80.7 63.8 73)	lab(80.7 18.6 61)	cmyk 0%, 27%, 68%, 0%
	#ffd494	rgb(255, 212, 148)	hsl(36 100% 79%)	hwb(36 58% 0%)	lch(87.6 38.8 75.7)	lab(87.6 9.55 37.6)	cmyk 0%, 17%, 42%, 0%
	#9effc6	rgb(158, 255, 198)	hsl(140 100% 81%)	hwb(140 62% 0%)	lch(92.9 42.9 155)	lab(92.9 -39 17.9)	cmyk 38%, 0%, 22%, 0%
	#39dbad	rgb(57, 219, 173)	hsl(160 69% 54%)	hwb(160 22% 14%)	lch(78.6 51.9 169)	lab(78.6 -50.9 10.3)	cmyk 74%, 0%, 21%, 14%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#F39C19

AA - 2.19



#ffba52

AA - 1.69



#ffd494

AA - 1.39



#9effc6

AA - 1.19



#39dbad

AA - 1.76



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.3% 0.058 0.15), oklab(83.5% 0.038 0.137), oklab(89.3% 0.021 0.092), oklab(92.5% -0.112 0.047), oklab(79.9% -0.144 0.028))

Fallback colors



background: linear-gradient(45deg, #F39C19, #ffba52, #ffd494, #9effc6, #39dbad)

Colors



<!-- Primary Colors -->
<color name="play_color_10">#F39C19</color>
<color name="play_color_20">#ffba52</color>
<color name="play_color_30">#ffd494</color>
<color name="play_color_40">#9effc6</color>
<color name="play_color_50">#39dbad</color>

PWA prompt