Cupid

#54081e

#941036

#cf4069

#e87696

#f5c4d4

#ffffff

#54081e

#941036

#cf4069

#e87696

#f5c4d4

#ffffff

Colors overview

Red

Pink

White

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#54081e	rgb(84, 8, 30)	hsl(340 83% 18%)	hwb(340 3.1% 67%)	lch(16.6 35.7 14.9)	lab(16.6 34.5 9.21)	cmyk 0%, 90%, 64%, 67%
	#941036	rgb(148, 16, 54)	hsl(340 80% 32%)	hwb(340 6.3% 42%)	lch(32.2 55.1 17.1)	lab(32.2 52.7 16.2)	cmyk 0%, 89%, 64%, 42%
	#cf4069	rgb(207, 64, 105)	hsl(340 60% 53%)	hwb(340 25% 19%)	lch(50 59.7 9.86)	lab(50 58.8 10.2)	cmyk 0%, 69%, 49%, 19%
	#e87696	rgb(232, 118, 150)	hsl(340 71% 69%)	hwb(340 46% 9%)	lch(64 47.6 5.06)	lab(64 47.4 4.19)	cmyk 0%, 49%, 35%, 9%
	#f5c4d4	rgb(245, 196, 212)	hsl(340 71% 86%)	hwb(340 77% 3.9%)	lch(83.9 19.8 357)	lab(83.9 19.8 -1.02)	cmyk 0%, 20%, 13%, 4%
	#ffffff	rgb(255, 255, 255)	hsl(none 0% 100%)	hwb(none 100% 0%)	lch(100 0 none)	lab(100 0 0)	cmyk 0%, 0%, 0%, 0%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#54081e

AAA - 14.68



#941036

AAA - 8.79



#cf4069

AA - 4.57



#e87696

AA - 2.81



#f5c4d4

AA - 1.52



#ffffff

AA - 1



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 space

HDR oklab colors New



background: linear-gradient(45deg, oklab(29.2% 0.104 0.021), oklab(43.2% 0.158 0.036), oklab(58.7% 0.179 0.023), oklab(70.5% 0.144 0.009), oklab(86.8% 0.059 -0.003), oklab(100% 0 0))

Fallback colors New



background: linear-gradient(45deg, #54081e, #941036, #cf4069, #e87696, #f5c4d4, #ffffff)

Colors



<resources>
    <color name="cupid_100">#54081e</color>
    <color name="cupid_200">#941036</color>
    <color name="cupid_300">#cf4069</color>
    <color name="cupid_400">#e87696</color>
    <color name="cupid_500">#f5c4d4</color>
    <color name="cupid_600">#ffffff</color>
</resources>

PWA prompt