#8d3bf7

#b784fa

#d4b5fc

#c7fa85

#a6f73b

Harmony v2

#8d3bf7

#b784fa

#d4b5fc

#c7fa85

#a6f73b



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

Purple

Green

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#8d3bf7	rgb(141, 59, 247)	hsl(270 92% 60%)	hwb(270 23% 3.1%)	lch(45.2 102 307)	lab(45.2 61.6 -81.2)	cmyk 43%, 76%, 0%, 3%
	#b784fa	rgb(183, 132, 250)	hsl(270 92% 75%)	hwb(270 52% 2%)	lch(64.1 64.4 306)	lab(64.1 37.6 -52.3)	cmyk 27%, 47%, 0%, 2%
	#d4b5fc	rgb(212, 181, 252)	hsl(270 92% 85%)	hwb(270 71% 1.2%)	lch(78.3 37.9 305)	lab(78.3 21.5 -31.1)	cmyk 16%, 28%, 0%, 1%
	#c7fa85	rgb(199, 250, 133)	hsl(86 92% 75%)	hwb(86 52% 2%)	lch(92.9 58.8 121)	lab(92.9 -30.7 50.2)	cmyk 20%, 0%, 47%, 2%
	#a6f73b	rgb(166, 247, 59)	hsl(86 92% 60%)	hwb(86 23% 3.1%)	lch(89.6 87.6 121)	lab(89.6 -45.4 74.9)	cmyk 33%, 0%, 76%, 3%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#8d3bf7

AA - 5.12



#b784fa

AA - 2.72



#d4b5fc

AA - 1.77



#c7fa85

AA - 1.2



#a6f73b

AA - 1.31



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(56.9% 0.117 -0.229), oklab(71.2% 0.092 -0.146), oklab(82.4% 0.058 -0.085), oklab(92.5% -0.097 0.122), oklab(89.1% -0.145 0.169))

Fallback colors



background: linear-gradient(45deg, #8d3bf7, #b784fa, #d4b5fc, #c7fa85, #a6f73b)

Colors



<!-- Primary Colors -->
<color name="harmony_v2_color_10">#8d3bf7</color>
<color name="harmony_v2_color_20">#b784fa</color>
<color name="harmony_v2_color_30">#d4b5fc</color>
<color name="harmony_v2_color_40">#c7fa85</color>
<color name="harmony_v2_color_50">#a6f73b</color>

PWA prompt