Shadow Pop

#1A1A2E

#16213E

#0F3460

#F4F4F4

#E94560

Actions

Explore the palette in different formats, and actions.

Colors overview

A dramatic symphony of deep blues and a playful pop of bright red.

AI-generated description.

Blue

White

Red

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#1a1a2e	rgb(26, 26, 46)	hsl(240 28% 14%)	oklab(23% 0.01 -0.04)	oklch(23% 0.04 280)	color(display-p3 0.1 0.1 0.17)
	#16213e	rgb(22, 33, 62)	hsl(220 48% 16%)	oklab(25% 0 -0.06)	oklch(25% 0.06 270)	color(display-p3 0.1 0.13 0.24)
	#0f3460	rgb(15, 52, 96)	hsl(210 73% 22%)	oklab(33% -0.02 -0.09)	oklch(33% 0.09 260)	color(display-p3 0.1 0.2 0.36)
	#f4f4f4	rgb(244, 244, 244)	hsl(none 0% 96%)	oklab(97% 0 0)	oklch(97% 0 none)	color(display-p3 0.96 0.96 0.96)
	#e94560	rgb(233, 69, 96)	hsl(350 79% 59%)	oklab(63% 0.19 0.05)	oklch(63% 0.2 16)	color(display-p3 0.84 0.32 0.39)

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

#1A1A2E

AAA - 17.05



#16213E

AAA - 15.89



#0F3460

AAA - 12.49



#F4F4F4

AA - 1.09



#E94560

AA - 3.82



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(22.8% 0.009 -0.037), oklab(25.4% -0.003 -0.057), oklab(32.5% -0.023 -0.085), oklab(96.7% 0 0), oklab(63.3% 0.192 0.054))

Fallback colors



background: linear-gradient(45deg, #1A1A2E, #16213E, #0F3460, #F4F4F4, #E94560)

Colors



<!-- Primary Colors -->
<color name="shadow_pop_color_10">#1A1A2E</color>
<color name="shadow_pop_color_20">#16213E</color>
<color name="shadow_pop_color_30">#0F3460</color>
<color name="shadow_pop_color_40">#F4F4F4</color>
<color name="shadow_pop_color_50">#E94560</color>

PWA prompt