Cobalt

#E6F1F5

#D4E2E5

#A6B9C1

#7997B0

#003366

Actions

Explore the palette in different formats, and actions.

Colors overview

White

Blue

Grey

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#e6f1f5	rgb(230, 241, 245)	hsl(200 43% 93%)	hwb(200 90% 3.9%)	lch(94.4 4.58 225)	lab(94.4 -3.21 -3.26)	cmyk 6%, 2%, 0%, 4%
	#d4e2e5	rgb(212, 226, 229)	hsl(190 25% 86%)	hwb(190 83% 10%)	lch(88.9 5.43 216)	lab(88.9 -4.42 -3.17)	cmyk 7%, 1%, 0%, 10%
	#a6b9c1	rgb(166, 185, 193)	hsl(200 18% 70%)	hwb(200 65% 24%)	lch(73.9 8.46 229)	lab(73.9 -5.53 -6.41)	cmyk 14%, 4%, 0%, 24%
	#7997b0	rgb(121, 151, 176)	hsl(210 26% 58%)	hwb(210 47% 31%)	lch(60.8 17.9 249)	lab(60.8 -6.28 -16.7)	cmyk 31%, 14%, 0%, 31%
	#003366	rgb(0, 51, 102)	hsl(210 100% 20%)	hwb(210 0% 60%)	lch(20.7 35 273)	lab(20.7 1.89 -35)	cmyk 100%, 50%, 0%, 60%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#E6F1F5

AA - 1.14



#D4E2E5

AA - 1.32



#A6B9C1

AA - 2.03



#7997B0

AA - 3.05



#003366

AAA - 12.6



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(95.1% -0.01 -0.009), oklab(90.3% -0.013 -0.008), oklab(77.4% -0.017 -0.017), oklab(66.3% -0.022 -0.045), oklab(32.3% -0.028 -0.099))

Fallback colors



background: linear-gradient(45deg, #E6F1F5, #D4E2E5, #A6B9C1, #7997B0, #003366)

Colors



<!-- Primary Colors -->
<color name="cobalt_color_10">#E6F1F5</color>
<color name="cobalt_color_20">#D4E2E5</color>
<color name="cobalt_color_30">#A6B9C1</color>
<color name="cobalt_color_40">#7997B0</color>
<color name="cobalt_color_50">#003366</color>

PWA prompt