#FFC0CB

#FF7F50

#DC143C

#8B0000

Scarlet Blaze

Actions

Explore the gradient in different formats, and actions.

Colors overview

Orange

Red

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#ffc0cb	rgb(255, 192, 203)	hsl(350 100% 88%)	hwb(350 75% 0%)	lch(83.8 24.7 8.75)	lab(83.8 24.4 3.76)	cmyk 0%, 25%, 20%, 0%
	#ff7f50	rgb(255, 127, 80)	hsl(16 100% 66%)	hwb(16 31% 0%)	lch(68 67.9 45.7)	lab(68 47.4 48.6)	cmyk 0%, 50%, 69%, 0%
	#dc143c	rgb(220, 20, 60)	hsl(350 83% 47%)	hwb(350 7.8% 14%)	lch(47.9 79.6 26.5)	lab(47.9 71.3 35.5)	cmyk 0%, 91%, 73%, 14%
	#8b0000	rgb(139, 0, 0)	hsl(0 100% 27%)	hwb(0 0% 45%)	lch(28.8 66.9 39.8)	lab(28.8 51.5 42.8)	cmyk 0%, 100%, 100%, 45%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#FFC0CB

AA - 1.53



#FF7F50

AA - 2.49



#DC143C

AA - 4.98



#8B0000

AAA - 10.01



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(86.8% 0.073 0.009), oklab(73.5% 0.128 0.109), oklab(57.1% 0.208 0.076), oklab(40% 0.143 0.08))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #FFC0CB, #FF7F50, #DC143C, #8B0000)

Colors



<!-- Primary Colors -->
<color name="scarlet_blaze_color_10">#FFC0CB</color>
<color name="scarlet_blaze_color_20">#FF7F50</color>
<color name="scarlet_blaze_color_30">#DC143C</color>
<color name="scarlet_blaze_color_40">#8B0000</color>

Gradient PRO

Pro feature only

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

PWA prompt