Purple/Yellow Color Palette

#512da8

#673ab7

#d1c4e9

#ffeb3b

#212121

#512da8

#673ab7

#d1c4e9

#ffeb3b

#212121

Colors overview

Purple

Yellow

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#512da8	rgb(81, 45, 168)	hsl(260 58% 42%)	hwb(260 18% 34%)	lch(29.6 73.2 303)	lab(29.6 39.8 -61.4)	cmyk 52%, 73%, 0%, 34%
	#673ab7	rgb(103, 58, 183)	hsl(260 52% 47%)	hwb(260 23% 28%)	lch(35.8 72.9 305)	lab(35.8 41.4 -60.1)	cmyk 44%, 68%, 0%, 28%
	#d1c4e9	rgb(209, 196, 233)	hsl(260 46% 84%)	hwb(260 77% 8.6%)	lch(81.1 19.4 301)	lab(81.1 9.92 -16.7)	cmyk 10%, 16%, 0%, 9%
	#ffeb3b	rgb(255, 235, 59)	hsl(54 100% 62%)	hwb(54 23% 0%)	lch(92.6 80.6 94.1)	lab(92.6 -5.81 80.4)	cmyk 0%, 8%, 77%, 0%
	#212121	rgb(33, 33, 33)	hsl(none 0% 13%)	hwb(none 13% 87%)	lch(12.7 0 none)	lab(12.7 0 0)	cmyk 0%, 0%, 0%, 87%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#512da8

AAA - 9.16



#673ab7

AAA - 7.32



#d1c4e9

AA - 1.64



#ffeb3b

AA - 1.22



#212121

AAA - 16.1



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(42.1% 0.061 -0.173), oklab(47.4% 0.078 -0.169), oklab(84.3% 0.027 -0.045), oklab(92.8% -0.039 0.176), oklab(24.8% 0 0))

Fallback colors



background: linear-gradient(45deg, #512da8, #673ab7, #d1c4e9, #ffeb3b, #212121)

Colors



<!-- Primary Colors -->
<color name="purple/yellow_color_10">#512da8</color>
<color name="purple/yellow_color_20">#673ab7</color>
<color name="purple/yellow_color_30">#d1c4e9</color>
<color name="purple/yellow_color_40">#ffeb3b</color>
<color name="purple/yellow_color_50">#212121</color>

PWA prompt