Sadness Color Gradient

 #c7b7d3

 #d3b9b7

 #c3d3b7

 #b7d1d3

Colors overview

 Purple

 Red

 Green

 Cyan

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#c7b7d3	rgb(199, 183, 211)	hsl(270 24% 77%)	hwb(270 72% 17%)	lch(76.4 15.5 309)	lab(76.4 9.74 -12)	cmyk 6%, 13%, 0%, 17%
	#d3b9b7	rgb(211, 185, 183)	hsl(4.3 24% 77%)	hwb(4.3 72% 17%)	lch(77.4 10.4 26.3)	lab(77.4 9.34 4.61)	cmyk 0%, 12%, 13%, 17%
	#c3d3b7	rgb(195, 211, 183)	hsl(94 24% 77%)	hwb(94 72% 17%)	lch(82.8 15.2 128)	lab(82.8 -9.38 12)	cmyk 8%, 0%, 13%, 17%
	#b7d1d3	rgb(183, 209, 211)	hsl(180 24% 77%)	hwb(180 72% 17%)	lch(81.9 9.62 205)	lab(81.9 -8.71 -4.09)	cmyk 13%, 1%, 0%, 17%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#c7b7d3

AA - 1.88



#d3b9b7

AA - 1.84



#c3d3b7

AA - 1.57



#b7d1d3

AA - 1.6



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.



32°

CPU



48°

GPU



100%

Usage



11°

Rain



70%

Storage

HDR space

HDR oklab colors New



--angle: 45deg; 
 background: linear-gradient(var(--angle), oklab(80.2% 0.028 -0.032), oklab(80.7% 0.028 0.012), oklab(84.7% -0.028 0.031), oklab(84.2% -0.026 -0.011))

Fallback colors New



--angle: 45deg; 
 background: linear-gradient(var(--angle), #c7b7d3, #d3b9b7, #c3d3b7, #b7d1d3)

Colors



<resources>
    <color name="sadness_100">#c7b7d3</color>
    <color name="sadness_200">#d3b9b7</color>
    <color name="sadness_300">#c3d3b7</color>
    <color name="sadness_400">#b7d1d3</color>
</resources>

Gradient PRO

Pro feature only

Get access to all app tokens, export files, and more.

PWA prompt