Mystic

#4C0052

#660066

#800080

#996699

#B399B3

#CCCCCC

Actions

Explore the palette in different formats, and actions.

Colors overview

Purple

White

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#4c0052	rgb(76, 0, 82)	hsl(300 100% 16%)	hwb(300 0% 68%)	lch(16.1 49 324)	lab(16.1 39.7 -28.7)	cmyk 7%, 100%, 0%, 68%
	#660066	rgb(102, 0, 102)	hsl(300 100% 20%)	hwb(300 0% 60%)	lch(22.9 56.8 327)	lab(22.9 47.7 -30.9)	cmyk 0%, 100%, 0%, 60%
	#800080	rgb(128, 0, 128)	hsl(300 100% 25%)	hwb(300 0% 50%)	lch(29.7 66.8 327)	lab(29.7 56.1 -36.3)	cmyk 0%, 100%, 0%, 50%
	#996699	rgb(153, 102, 153)	hsl(300 20% 50%)	hwb(300 40% 40%)	lch(50.1 33.6 325)	lab(50.1 27.5 -19.3)	cmyk 0%, 33%, 0%, 40%
	#b399b3	rgb(179, 153, 179)	hsl(300 15% 65%)	hwb(300 60% 30%)	lch(66.2 16.6 324)	lab(66.2 13.4 -9.82)	cmyk 0%, 15%, 0%, 30%
	#cccccc	rgb(204, 204, 204)	hsl(none 0% 80%)	hwb(none 80% 20%)	lch(82 0 none)	lab(82 0 0)	cmyk 0%, 0%, 0%, 20%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#4C0052

AAA - 14.69



#660066

AAA - 11.95



#800080

AAA - 9.41



#996699

AA - 4.45



#B399B3

AA - 2.58



#CCCCCC

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.

HDR color space

HDR oklab colors



background: linear-gradient(45deg, oklab(29.7% 0.113 -0.08), oklab(35.8% 0.14 -0.086), oklab(42.1% 0.165 -0.101), oklab(58.2% 0.081 -0.053), oklab(71.4% 0.039 -0.026), oklab(84.5% 0 0))

Fallback colors



background: linear-gradient(45deg, #4C0052, #660066, #800080, #996699, #B399B3, #CCCCCC)

Colors



<!-- Primary Colors -->
<color name="mystic_color_10">#4C0052</color>
<color name="mystic_color_20">#660066</color>
<color name="mystic_color_30">#800080</color>
<color name="mystic_color_40">#996699</color>
<color name="mystic_color_50">#B399B3</color>
<color name="mystic_color_60">#CCCCCC</color>

PWA prompt