Sweet

#afadf5

#d3adf5

#adcff5

Actions

Explore the palette in different formats, and actions.

Colors overview

Purple

Cyan

Pink

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#afadf5	rgb(175, 173, 245)	hsl(240 78% 82%)	hwb(240 68% 3.9%)	lch(72.9 38.1 289)	lab(72.9 12.6 -35.9)	cmyk 29%, 29%, 0%, 4%
	#d3adf5	rgb(211, 173, 245)	hsl(270 78% 82%)	hwb(270 68% 3.9%)	lch(76.1 39.1 308)	lab(76.1 24.2 -30.8)	cmyk 14%, 29%, 0%, 4%
	#adcff5	rgb(173, 207, 245)	hsl(210 78% 82%)	hwb(210 68% 3.9%)	lch(81.6 23.3 257)	lab(81.6 -5.24 -22.7)	cmyk 29%, 16%, 0%, 4%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#afadf5

AA - 2.07



#d3adf5

AA - 1.89



#adcff5

AA - 1.61



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(77.6% 0.026 -0.099), oklab(80.6% 0.066 -0.084), oklab(84.3% -0.021 -0.061))

Fallback colors



background: linear-gradient(45deg, #afadf5, #d3adf5, #adcff5)

Colors



<!-- Primary Colors -->
<color name="sweet_color_10">#afadf5</color>
<color name="sweet_color_20">#d3adf5</color>
<color name="sweet_color_30">#adcff5</color>

PWA prompt