Royal

#462eff

#3a26d4

#2f1faa

#231780

#0c082a

Actions

Explore the palette in different formats, and actions.

Colors overview

Blue

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#462eff	rgb(70, 46, 255)	hsl(250 100% 59%)	oklab(50% 0.02 -0.28)	oklch(50% 0.28 270)	color(display-p3 0.26 0.18 0.96)
	#3a26d4	rgb(58, 38, 212)	hsl(250 70% 49%)	oklab(44% 0.02 -0.24)	oklch(44% 0.24 270)	color(display-p3 0.22 0.15 0.8)
	#2f1faa	rgb(47, 31, 170)	hsl(250 69% 39%)	oklab(38% 0.02 -0.2)	oklch(38% 0.2 280)	color(display-p3 0.17 0.12 0.64)
	#231780	rgb(35, 23, 128)	hsl(250 70% 30%)	oklab(31% 0.02 -0.16)	oklch(31% 0.16 280)	color(display-p3 0.13 0.09 0.48)
	#0c082a	rgb(12, 8, 42)	hsl(250 68% 9.8%)	oklab(17% 0.01 -0.06)	oklch(17% 0.07 280)	color(display-p3 0.04 0.03 0.16)

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

#462eff

AA - 6.78



#3a26d4

AAA - 8.72



#2f1faa

AAA - 11.06



#231780

AAA - 13.94



#0c082a

AAA - 19.37



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(50.2% 0.022 -0.281), oklab(43.9% 0.02 -0.243), oklab(37.7% 0.02 -0.203), oklab(31.1% 0.018 -0.162), oklab(16.7% 0.014 -0.065))

Fallback colors



background: linear-gradient(45deg, #462eff, #3a26d4, #2f1faa, #231780, #0c082a)

Colors



<!-- Primary Colors -->
<color name="royal_color_10">#462eff</color>
<color name="royal_color_20">#3a26d4</color>
<color name="royal_color_30">#2f1faa</color>
<color name="royal_color_40">#231780</color>
<color name="royal_color_50">#0c082a</color>

PWA prompt