Ultramarine Shades

#0b012e

#140259

#1e0383

#2804ae

#3205d8

Actions

Explore the palette in different formats, and actions.

Colors overview

Blue

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#0b012e	rgb(11, 1, 46)	hsl(250 96% 9.2%)	oklab(15% 0.02 -0.08)	oklch(15% 0.09 280)	color(display-p3 0.04 0.01 0.17)
	#140259	rgb(20, 2, 89)	hsl(250 96% 18%)	oklab(23% 0.02 -0.14)	oklch(23% 0.14 280)	color(display-p3 0.07 0.01 0.33)
	#1e0383	rgb(30, 3, 131)	hsl(250 96% 26%)	oklab(29% 0.01 -0.18)	oklch(29% 0.18 270)	color(display-p3 0.11 0.02 0.49)
	#2804ae	rgb(40, 4, 174)	hsl(250 96% 35%)	oklab(36% 0.01 -0.22)	oklch(36% 0.22 270)	color(display-p3 0.14 0.02 0.65)
	#3205d8	rgb(50, 5, 216)	hsl(250 95% 43%)	oklab(42% 0.01 -0.26)	oklch(42% 0.26 270)	color(display-p3 0.18 0.03 0.81)

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

#0b012e

AAA - 19.84



#140259

AAA - 17.75



#1e0383

AAA - 15.04



#2804ae

AAA - 12.21



#3205d8

AAA - 9.77



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(15.4% 0.02 -0.084), oklab(22.6% 0.016 -0.135), oklab(29.3% 0.015 -0.181), oklab(35.7% 0.014 -0.224), oklab(41.8% 0.014 -0.264))

Fallback colors



background: linear-gradient(45deg, #0b012e, #140259, #1e0383, #2804ae, #3205d8)

Colors



<!-- Primary Colors -->
<color name="ultramarine_shades_color_10">#0b012e</color>
<color name="ultramarine_shades_color_20">#140259</color>
<color name="ultramarine_shades_color_30">#1e0383</color>
<color name="ultramarine_shades_color_40">#2804ae</color>
<color name="ultramarine_shades_color_50">#3205d8</color>

PWA prompt