#7281f6

#bac2fa

#eaecfd

#e85edf

#d91fcc

Lilac

#7281f6

#bac2fa

#eaecfd

#e85edf

#d91fcc



Web code

Get CSS, SCSS, & Tailwind code for development



App tokens

Get Android, Flutter, Swift, & MAUI tokens



Quick view

Inspect colors in multiple color spaces

Colors overview

Blue

Pink

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#7281f6	rgb(114, 129, 246)	hsl(230 88% 71%)	hwb(230 45% 3.5%)	lch(57.1 64.6 288)	lab(57.1 19.6 -61.6)	cmyk 54%, 48%, 0%, 4%
	#bac2fa	rgb(186, 194, 250)	hsl(230 86% 85%)	hwb(230 73% 2%)	lch(79.3 29.4 282)	lab(79.3 6.19 -28.8)	cmyk 26%, 22%, 0%, 2%
	#eaecfd	rgb(234, 236, 253)	hsl(230 83% 95%)	hwb(230 92% 0.78%)	lch(93.6 8.64 281)	lab(93.6 1.66 -8.48)	cmyk 8%, 7%, 0%, 1%
	#e85edf	rgb(232, 94, 223)	hsl(300 75% 64%)	hwb(300 37% 9%)	lch(62 76.7 329)	lab(62 65.5 -40.1)	cmyk 0%, 59%, 4%, 9%
	#d91fcc	rgb(217, 31, 204)	hsl(300 75% 49%)	hwb(300 12% 15%)	lch(51.9 90.5 330)	lab(51.9 78.3 -45.3)	cmyk 0%, 86%, 6%, 15%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#7281f6

AA - 3.39



#bac2fa

AA - 1.72



#eaecfd

AA - 1.17



#e85edf

AA - 2.95



#d91fcc

AA - 4.18



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(64.8% 0.015 -0.173), oklab(82.7% 0.011 -0.078), oklab(94.7% 0.004 -0.023), oklab(70.2% 0.195 -0.111), oklab(62.1% 0.235 -0.126))

Fallback colors



background: linear-gradient(45deg, #7281f6, #bac2fa, #eaecfd, #e85edf, #d91fcc)

Colors



<!-- Primary Colors -->
<color name="lilac_color_10">#7281f6</color>
<color name="lilac_color_20">#bac2fa</color>
<color name="lilac_color_30">#eaecfd</color>
<color name="lilac_color_40">#e85edf</color>
<color name="lilac_color_50">#d91fcc</color>

PWA prompt