Mystery

#473a5e

#817691

#beb8c7

#e6e1ed

Actions

Explore the palette in different formats, and actions.

Colors overview

Purple

Grey

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#473a5e	rgb(71, 58, 94)	hsl(260 24% 30%)	oklab(38% 0.03 -0.05)	oklch(38% 0.06 300)	color(display-p3 0.27 0.23 0.36)
	#817691	rgb(129, 118, 145)	hsl(260 11% 52%)	oklab(59% 0.02 -0.04)	oklch(59% 0.04 300)	color(display-p3 0.5 0.46 0.56)
	#beb8c7	rgb(190, 184, 199)	hsl(260 12% 75%)	oklab(79% 0.01 -0.02)	oklch(79% 0.02 300)	color(display-p3 0.74 0.72 0.78)
	#e6e1ed	rgb(230, 225, 237)	hsl(270 25% 91%)	oklab(92% 0.01 -0.01)	oklch(92% 0.02 300)	color(display-p3 0.9 0.88 0.93)

 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.

#473a5e

AAA - 10.32



#817691

AA - 4.25



#beb8c7

AA - 1.93



#e6e1ed

AA - 1.28



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(37.8% 0.031 -0.054), oklab(58.5% 0.024 -0.035), oklab(79.2% 0.012 -0.018), oklab(91.7% 0.01 -0.014))

Fallback colors



background: linear-gradient(45deg, #473a5e, #817691, #beb8c7, #e6e1ed)

Colors



<!-- Primary Colors -->
<color name="mystery_color_10">#473a5e</color>
<color name="mystery_color_20">#817691</color>
<color name="mystery_color_30">#beb8c7</color>
<color name="mystery_color_40">#e6e1ed</color>

PWA prompt