Security

#020066

#0139df

#9eb6ff

#ffcc00

#fff4c7

Actions

Explore the palette in different formats, and actions.

Colors overview

Blue

Yellow

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#020066	rgb(2, 0, 102)	hsl(240 100% 20%)	hwb(240 0% 60%)	lch(7.4 66.7 301)	lab(7.4 34.8 -56.9)	cmyk 98%, 100%, 0%, 60%
	#0139df	rgb(1, 57, 223)	hsl(220 99% 44%)	hwb(220 0.39% 13%)	lch(32.7 97.5 295)	lab(32.7 40.6 -88.6)	cmyk 100%, 74%, 0%, 13%
	#9eb6ff	rgb(158, 182, 255)	hsl(230 100% 81%)	hwb(230 62% 0%)	lch(74.3 39.5 277)	lab(74.3 4.83 -39.2)	cmyk 38%, 29%, 0%, 0%
	#ffcc00	rgb(255, 204, 0)	hsl(48 100% 50%)	hwb(48 0% 0%)	lch(84.8 85.2 84.4)	lab(84.8 8.24 84.8)	cmyk 0%, 20%, 100%, 0%
	#fff4c7	rgb(255, 244, 199)	hsl(48 100% 89%)	hwb(48 78% 0%)	lch(96.2 23.2 93.2)	lab(96.2 -1.32 23.2)	cmyk 0%, 4%, 22%, 0%

 Click a color format to copy to your clipboard.

Contrast ratios checker

Click one color card to view the complete contrast checker tests.

#020066

AAA - 17.58



#0139df

AAA - 7.91



#9eb6ff

AA - 1.98



#ffcc00

AA - 1.51



#fff4c7

AA - 1.1



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.2% -0.014 -0.158), oklab(45.6% -0.027 -0.25), oklab(78.6% 0 -0.108), oklab(86.5% -0.001 0.177), oklab(96.5% -0.006 0.059))

Fallback colors



background: linear-gradient(45deg, #020066, #0139df, #9eb6ff, #ffcc00, #fff4c7)

Colors



<!-- Primary Colors -->
<color name="security_color_10">#020066</color>
<color name="security_color_20">#0139df</color>
<color name="security_color_30">#9eb6ff</color>
<color name="security_color_40">#ffcc00</color>
<color name="security_color_50">#fff4c7</color>

PWA prompt