Retro Neon

#000000

#696969

#d1d1d1

#e957ff

#47fff0

Actions

Explore the palette in different formats, and actions.

Colors overview

Black

Pink

Cyan

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#000000	rgb(0, 0, 0)	hsl(none 0% 0%)	oklab(0% 0 0)	oklch(0% 0 none)	color(display-p3 0 0 0)
	#696969	rgb(105, 105, 105)	hsl(none 0% 41%)	oklab(52% 0 0)	oklch(52% 0 none)	color(display-p3 0.41 0.41 0.41)
	#d1d1d1	rgb(209, 209, 209)	hsl(none 0% 82%)	oklab(86% 0 0)	oklch(86% 0 none)	color(display-p3 0.82 0.82 0.82)
	#e957ff	rgb(233, 87, 255)	hsl(290 100% 67%)	oklab(71% 0.2 -0.16)	oklch(71% 0.26 320)	color(display-p3 0.85 0.38 0.97)
	#47fff0	rgb(71, 255, 240)	hsl(180 100% 64%)	oklab(91% -0.14 -0.02)	oklch(91% 0.14 190)	color(display-p3 0.52 0.99 0.94)

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

#000000

AAA - 21



#696969

AA - 5.48



#d1d1d1

AA - 1.52



#e957ff

AA - 2.88



#47fff0

AA - 1.24



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(0% 0 0), oklab(52.1% 0 0), oklab(86.1% 0 0), oklab(71.3% 0.205 -0.159), oklab(90.7% -0.143 -0.017))

Fallback colors



background: linear-gradient(45deg, #000000, #696969, #d1d1d1, #e957ff, #47fff0)

Colors



<!-- Primary Colors -->
<color name="retro_neon_color_10">#000000</color>
<color name="retro_neon_color_20">#696969</color>
<color name="retro_neon_color_30">#d1d1d1</color>
<color name="retro_neon_color_40">#e957ff</color>
<color name="retro_neon_color_50">#47fff0</color>

PWA prompt