#E60026

#B3001F

#800014

#4D000A

Alliance

Actions

Explore the gradient in different formats, and actions.

Colors overview

Red

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#e60026	rgb(230, 0, 38)	hsl(350 100% 45%)	hwb(350 0% 9.8%)	lch(49.2 90.3 33.7)	lab(49.2 75.1 50.1)	cmyk 0%, 100%, 83%, 10%
	#b3001f	rgb(179, 0, 31)	hsl(350 100% 35%)	hwb(350 0% 30%)	lch(38 73.7 32.3)	lab(38 62.3 39.4)	cmyk 0%, 100%, 83%, 30%
	#800014	rgb(128, 0, 20)	hsl(350 100% 25%)	hwb(350 0% 50%)	lch(26.3 57.4 31.8)	lab(26.3 48.8 30.3)	cmyk 0%, 100%, 84%, 50%
	#4d000a	rgb(77, 0, 10)	hsl(350 100% 15%)	hwb(350 0% 70%)	lch(13.6 38.4 27.1)	lab(13.6 34.2 17.5)	cmyk 0%, 100%, 87%, 70%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#E60026

AA - 4.78



#B3001F

AAA - 7.15



#800014

AAA - 10.89



#4D000A

AAA - 15.9



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.



32°

CPU



48°

GPU



100%

Usage



11°

Rain



70%

Storage

HDR color space

HDR oklab colors



--angle: 45deg; 
background: linear-gradient(var(--angle), oklab(58.3% 0.214 0.1), oklab(48.3% 0.179 0.08), oklab(37.8% 0.14 0.062), oklab(26.5% 0.099 0.041))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #E60026, #B3001F, #800014, #4D000A)

Colors



<!-- Primary Colors -->
<color name="alliance_color_10">#E60026</color>
<color name="alliance_color_20">#B3001F</color>
<color name="alliance_color_30">#800014</color>
<color name="alliance_color_40">#4D000A</color>

Gradient PRO

Pro feature only

Get access to all app tokens, export files, and more.

PWA prompt