Pain

#DA6A20

#3D3544

#DABEB0

#AFA0C1

#8A303A

Actions

Explore the palette in different formats, and actions.

Colors overview

Red

Black

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#da6a20	rgb(218, 106, 32)	hsl(24 74% 49%)	hwb(24 13% 15%)	lch(58.1 72 54.4)	lab(58.1 41.9 58.6)	cmyk 0%, 51%, 85%, 15%
	#3d3544	rgb(61, 53, 68)	hsl(270 12% 24%)	hwb(270 21% 73%)	lch(23.5 10.1 308)	lab(23.5 6.23 -8)	cmyk 10%, 22%, 0%, 73%
	#dabeb0	rgb(218, 190, 176)	hsl(20 36% 77%)	hwb(20 69% 15%)	lch(79.1 14 51.7)	lab(79.1 8.66 11)	cmyk 0%, 13%, 19%, 15%
	#afa0c1	rgb(175, 160, 193)	hsl(270 21% 69%)	hwb(270 63% 24%)	lch(68 18.2 305)	lab(68 10.4 -15)	cmyk 9%, 17%, 0%, 24%
	#8a303a	rgb(138, 48, 58)	hsl(350 48% 36%)	hwb(350 19% 46%)	lch(34 42.4 21.4)	lab(34 39.5 15.5)	cmyk 0%, 65%, 58%, 46%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#DA6A20

AA - 3.46



#3D3544

AAA - 11.72



#DABEB0

AA - 1.75



#AFA0C1

AA - 2.43



#8A303A

AAA - 8.18



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(64.7% 0.107 0.121), oklab(34.3% 0.018 -0.022), oklab(82.2% 0.025 0.028), oklab(72.9% 0.029 -0.04), oklab(44.3% 0.117 0.036))

Fallback colors



background: linear-gradient(45deg, #DA6A20, #3D3544, #DABEB0, #AFA0C1, #8A303A)

Colors



<!-- Primary Colors -->
<color name="pain_color_10">#DA6A20</color>
<color name="pain_color_20">#3D3544</color>
<color name="pain_color_30">#DABEB0</color>
<color name="pain_color_40">#AFA0C1</color>
<color name="pain_color_50">#8A303A</color>

PWA prompt