Neon Lights

#a5fbfc

#ffa0c7

#fdf5a0

#e3e5f1

#081e43

Actions

Explore the palette in different formats, and actions.

Colors overview

Cyan

Red

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#a5fbfc	rgb(165, 251, 252)	hsl(180 94% 82%)	oklab(93% -0.08 -0.02)	oklch(93% 0.08 200)	color(display-p3 0.72 0.98 0.98)
	#ffa0c7	rgb(255, 160, 199)	hsl(340 100% 81%)	oklab(81% 0.12 -0.01)	oklch(81% 0.12 350)	color(display-p3 0.95 0.64 0.78)
	#fdf5a0	rgb(253, 245, 160)	hsl(55 96% 81%)	oklab(96% -0.02 0.1)	oklch(96% 0.11 100)	color(display-p3 0.99 0.96 0.67)
	#e3e5f1	rgb(227, 229, 241)	hsl(230 33% 92%)	oklab(92% 0 -0.02)	oklch(92% 0.02 280)	color(display-p3 0.89 0.9 0.94)
	#081e43	rgb(8, 30, 67)	hsl(220 79% 15%)	oklab(24% -0.01 -0.07)	oklch(24% 0.08 260)	color(display-p3 0.05 0.12 0.25)

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

#a5fbfc

AA - 1.17



#ffa0c7

AA - 1.89



#fdf5a0

AA - 1.12



#e3e5f1

AA - 1.25



#081e43

AAA - 16.44



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(93.4% -0.079 -0.024), oklab(81.2% 0.121 -0.013), oklab(95.8% -0.025 0.103), oklab(92.4% 0.002 -0.016), oklab(24.3% -0.013 -0.074))

Fallback colors



background: linear-gradient(45deg, #a5fbfc, #ffa0c7, #fdf5a0, #e3e5f1, #081e43)

Colors



<!-- Primary Colors -->
<color name="neon_lights_color_10">#a5fbfc</color>
<color name="neon_lights_color_20">#ffa0c7</color>
<color name="neon_lights_color_30">#fdf5a0</color>
<color name="neon_lights_color_40">#e3e5f1</color>
<color name="neon_lights_color_50">#081e43</color>

PWA prompt