Jacarandas

#693d95

#8352b3

#9c67d1

#cea2e7

Actions

Explore the palette in different formats, and actions.

Colors overview

Purple

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#693d95	rgb(105, 61, 149)	hsl(270 42% 41%)	oklab(46% 0.08 -0.12)	oklch(46% 0.14 300)	color(display-p3 0.39 0.25 0.57)
	#8352b3	rgb(131, 82, 179)	hsl(270 39% 51%)	oklab(54% 0.09 -0.12)	oklch(54% 0.15 310)	color(display-p3 0.49 0.33 0.68)
	#9c67d1	rgb(156, 103, 209)	hsl(270 54% 61%)	oklab(62% 0.09 -0.13)	oklch(62% 0.16 310)	color(display-p3 0.58 0.41 0.8)
	#cea2e7	rgb(206, 162, 231)	hsl(280 59% 77%)	oklab(78% 0.07 -0.08)	oklch(78% 0.11 310)	color(display-p3 0.78 0.64 0.89)

 Click on a color value to copy it to your clipboard.

Contrast ratios checker

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

#693d95

AAA - 7.77



#8352b3

AA - 5.49



#9c67d1

AA - 3.98



#cea2e7

AA - 2.11



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(45.6% 0.08 -0.117), oklab(53.7% 0.087 -0.124), oklab(61.5% 0.093 -0.132), oklab(77.6% 0.073 -0.078))

Fallback colors



background: linear-gradient(45deg, #693d95, #8352b3, #9c67d1, #cea2e7)

Colors



<!-- Primary Colors -->
<color name="jacarandas_color_10">#693d95</color>
<color name="jacarandas_color_20">#8352b3</color>
<color name="jacarandas_color_30">#9c67d1</color>
<color name="jacarandas_color_40">#cea2e7</color>

PWA prompt