Space

#042959

#0A4DA6

#2c7ce6

#79C4F2

#c7e3f0

Actions

Explore the palette in different formats, and actions.

Colors overview

Blue

Cyan

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#042959	rgb(4, 41, 89)	hsl(210 91% 18%)	oklab(29% -0.02 -0.09)	oklch(29% 0.1 260)	color(display-p3 0.06 0.16 0.34)
	#0a4da6	rgb(10, 77, 166)	hsl(210 89% 35%)	oklab(44% -0.03 -0.15)	oklch(44% 0.16 260)	color(display-p3 0.13 0.3 0.63)
	#2c7ce6	rgb(44, 124, 230)	hsl(210 79% 54%)	oklab(60% -0.04 -0.17)	oklch(60% 0.18 260)	color(display-p3 0.26 0.48 0.87)
	#79c4f2	rgb(121, 196, 242)	hsl(200 82% 71%)	oklab(79% -0.05 -0.08)	oklch(79% 0.1 240)	color(display-p3 0.54 0.76 0.93)
	#c7e3f0	rgb(199, 227, 240)	hsl(200 58% 86%)	oklab(90% -0.02 -0.03)	oklch(90% 0.03 230)	color(display-p3 0.8 0.89 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.

#042959

AAA - 14.31



#0A4DA6

AAA - 7.99



#2c7ce6

AA - 4.09



#79C4F2

AA - 1.91



#c7e3f0

AA - 1.33



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(28.8% -0.021 -0.093), oklab(43.9% -0.031 -0.153), oklab(59.5% -0.04 -0.174), oklab(78.9% -0.054 -0.083), oklab(89.9% -0.023 -0.025))

Fallback colors



background: linear-gradient(45deg, #042959, #0A4DA6, #2c7ce6, #79C4F2, #c7e3f0)

Colors



<!-- Primary Colors -->
<color name="space_color_10">#042959</color>
<color name="space_color_20">#0A4DA6</color>
<color name="space_color_30">#2c7ce6</color>
<color name="space_color_40">#79C4F2</color>
<color name="space_color_50">#c7e3f0</color>

PWA prompt