Trafficpurple

#f4a3e2

#db8ac9

#c170af

#a85796

#9b4a89

Actions

Explore the palette in different formats, and actions.

Colors overview

Pink

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#f4a3e2	rgb(244, 163, 226)	hsl(310 79% 80%)	hwb(310 64% 4.3%)	lch(76.7 42.3 333)	lab(76.7 37.7 -19.2)	cmyk 0%, 33%, 7%, 4%
	#db8ac9	rgb(219, 138, 201)	hsl(310 53% 70%)	hwb(310 54% 14%)	lch(67.7 43.1 333)	lab(67.7 38.5 -19.3)	cmyk 0%, 37%, 8%, 14%
	#c170af	rgb(193, 112, 175)	hsl(310 40% 60%)	hwb(310 44% 24%)	lch(58.1 43.9 334)	lab(58.1 39.3 -19.5)	cmyk 0%, 42%, 9%, 24%
	#a85796	rgb(168, 87, 150)	hsl(310 32% 50%)	hwb(310 34% 34%)	lch(48.8 44.7 334)	lab(48.8 40.2 -19.5)	cmyk 0%, 48%, 11%, 34%
	#9b4a89	rgb(155, 74, 137)	hsl(310 35% 45%)	hwb(310 29% 39%)	lch(43.8 45 334)	lab(43.8 40.6 -19.4)	cmyk 0%, 52%, 12%, 39%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#f4a3e2

AA - 1.87



#db8ac9

AA - 2.47



#c170af

AA - 3.38



#a85796

AA - 4.69



#9b4a89

AA - 5.62



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(81.4% 0.113 -0.052), oklab(73.7% 0.115 -0.053), oklab(65.5% 0.118 -0.053), oklab(57.5% 0.121 -0.054), oklab(53.2% 0.123 -0.053))

Fallback colors



background: linear-gradient(45deg, #f4a3e2, #db8ac9, #c170af, #a85796, #9b4a89)

Colors



<!-- Primary Colors -->
<color name="trafficpurple_color_10">#f4a3e2</color>
<color name="trafficpurple_color_20">#db8ac9</color>
<color name="trafficpurple_color_30">#c170af</color>
<color name="trafficpurple_color_40">#a85796</color>
<color name="trafficpurple_color_50">#9b4a89</color>

PWA prompt