Pulse Purple

#8395f9

#b8bdf2

#f3ffe8

#def2cd

#1f1b36

Actions

Explore the palette in different formats, and actions.

Colors overview

Purple

Yellow

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#8395f9	rgb(131, 149, 249)	hsl(230 91% 75%)	oklab(70% 0.01 -0.15)	oklch(70% 0.15 270)	color(display-p3 0.53 0.58 0.95)
	#b8bdf2	rgb(184, 189, 242)	hsl(230 69% 84%)	oklab(81% 0.01 -0.07)	oklch(81% 0.07 280)	color(display-p3 0.73 0.74 0.93)
	#f3ffe8	rgb(243, 255, 232)	hsl(91 100% 95%)	oklab(98% -0.02 0.03)	oklch(98% 0.03 130)	color(display-p3 0.96 1 0.92)
	#def2cd	rgb(222, 242, 205)	hsl(92 59% 88%)	oklab(94% -0.03 0.04)	oklch(94% 0.05 130)	color(display-p3 0.89 0.95 0.82)
	#1f1b36	rgb(31, 27, 54)	hsl(250 33% 16%)	oklab(24% 0.02 -0.05)	oklch(24% 0.05 290)	color(display-p3 0.12 0.11 0.2)

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

#8395f9

AA - 2.75



#b8bdf2

AA - 1.81



#f3ffe8

AA - 1.03



#def2cd

AA - 1.18



#1f1b36

AAA - 16.55



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(69.9% 0.011 -0.147), oklab(81.3% 0.013 -0.074), oklab(98.5% -0.021 0.025), oklab(93.7% -0.035 0.04), oklab(24.2% 0.016 -0.048))

Fallback colors



background: linear-gradient(45deg, #8395f9, #b8bdf2, #f3ffe8, #def2cd, #1f1b36)

Colors



<!-- Primary Colors -->
<color name="pulse_purple_color_10">#8395f9</color>
<color name="pulse_purple_color_20">#b8bdf2</color>
<color name="pulse_purple_color_30">#f3ffe8</color>
<color name="pulse_purple_color_40">#def2cd</color>
<color name="pulse_purple_color_50">#1f1b36</color>

PWA prompt