Spooky

#380227

#5e0d45

#913173

#d98f41

#cf4d25

Actions

Explore the palette in different formats, and actions.

Colors overview

Purple

Orange

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#380227	rgb(56, 2, 39)	hsl(320 93% 11%)	oklab(23% 0.09 -0.02)	oklch(23% 0.09 340)	color(display-p3 0.2 0.02 0.15)
	#5e0d45	rgb(94, 13, 69)	hsl(320 76% 21%)	oklab(33% 0.12 -0.03)	oklch(33% 0.13 340)	color(display-p3 0.34 0.08 0.26)
	#913173	rgb(145, 49, 115)	hsl(320 49% 38%)	oklab(48% 0.14 -0.05)	oklch(48% 0.15 340)	color(display-p3 0.53 0.22 0.44)
	#d98f41	rgb(217, 143, 65)	hsl(31 67% 55%)	oklab(71% 0.06 0.12)	oklch(71% 0.13 64)	color(display-p3 0.81 0.57 0.31)
	#cf4d25	rgb(207, 77, 37)	hsl(14 70% 48%)	oklab(59% 0.14 0.1)	oklch(59% 0.17 37)	color(display-p3 0.75 0.34 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.

#380227

AAA - 17.41



#5e0d45

AAA - 12.96



#913173

AAA - 7.26



#d98f41

AA - 2.63



#cf4d25

AA - 4.42



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(23% 0.09 -0.025), oklab(33.1% 0.122 -0.035), oklab(47.5% 0.142 -0.046), oklab(71.1% 0.056 0.116), oklab(59.1% 0.138 0.104))

Fallback colors



background: linear-gradient(45deg, #380227, #5e0d45, #913173, #d98f41, #cf4d25)

Colors



<!-- Primary Colors -->
<color name="spooky_color_10">#380227</color>
<color name="spooky_color_20">#5e0d45</color>
<color name="spooky_color_30">#913173</color>
<color name="spooky_color_40">#d98f41</color>
<color name="spooky_color_50">#cf4d25</color>

PWA prompt