Cereal

#fb8781

#fdcecc

#fffdfd

#81fa87

#8781fa

Actions

Explore the palette in different formats, and actions.

Colors overview

Red

Green

Blue

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#fb8781	rgb(251, 135, 129)	hsl(3 94% 75%)	hwb(3 51% 1.6%)	lch(69.6 50.7 28.5)	lab(69.6 44.6 24.2)	cmyk 0%, 46%, 49%, 2%
	#fdcecc	rgb(253, 206, 204)	hsl(2.4 92% 90%)	hwb(2.4 80% 0.78%)	lch(86.9 18.5 24.2)	lab(86.9 16.9 7.59)	cmyk 0%, 19%, 19%, 1%
	#fffdfd	rgb(255, 253, 253)	hsl(0 100% 100%)	hwb(0 99% 0%)	lch(99.5 0.728 19.7)	lab(99.5 0.685 0.246)	cmyk 0%, 1%, 1%, 0%
	#81fa87	rgb(129, 250, 135)	hsl(120 92% 74%)	hwb(120 51% 2%)	lch(89.3 68.7 140)	lab(89.3 -52.7 44)	cmyk 48%, 0%, 46%, 2%
	#8781fa	rgb(135, 129, 250)	hsl(240 92% 74%)	hwb(240 51% 2%)	lch(58.9 66.1 293)	lab(58.9 25.8 -60.8)	cmyk 46%, 48%, 0%, 2%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#fb8781

AA - 2.36



#fdcecc

AA - 1.41



#fffdfd

AA - 1.01



#81fa87

AA - 1.31



#8781fa

AA - 3.2



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(75% 0.13 0.058), oklab(89.1% 0.05 0.019), oklab(99.6% 0.002 0.001), oklab(88.8% -0.154 0.109), oklab(66.5% 0.039 -0.17))

Fallback colors



background: linear-gradient(45deg, #fb8781, #fdcecc, #fffdfd, #81fa87, #8781fa)

Colors



<!-- Primary Colors -->
<color name="cereal_color_10">#fb8781</color>
<color name="cereal_color_20">#fdcecc</color>
<color name="cereal_color_30">#fffdfd</color>
<color name="cereal_color_40">#81fa87</color>
<color name="cereal_color_50">#8781fa</color>

PWA prompt