Scarlet Night

#FF2400

#C70039

#99003D

#660033

#330026

Actions

Explore the palette in different formats, and actions.

Colors overview

Red

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#ff2400	rgb(255, 36, 0)	hsl(8.5 100% 50%)	oklab(64% 0.21 0.13)	oklch(64% 0.25 31)	color(display-p3 0.92 0.25 0.14)
	#c70039	rgb(199, 0, 57)	hsl(340 100% 39%)	oklab(53% 0.2 0.07)	oklch(53% 0.21 18)	color(display-p3 0.72 0.15 0.24)
	#99003d	rgb(153, 0, 61)	hsl(340 100% 30%)	oklab(44% 0.17 0.03)	oklch(44% 0.17 9)	color(display-p3 0.55 0.1 0.24)
	#660033	rgb(102, 0, 51)	hsl(330 100% 20%)	oklab(33% 0.13 0)	oklch(33% 0.13 360)	color(display-p3 0.36 0.06 0.2)
	#330026	rgb(51, 0, 38)	hsl(320 100% 10%)	oklab(22% 0.09 -0.03)	oklch(22% 0.09 340)	color(display-p3 0.18 0.01 0.14)

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

#FF2400

AA - 3.81



#C70039

AA - 6.02



#99003D

AAA - 8.67



#660033

AAA - 13.02



#330026

AAA - 17.96



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(63.8% 0.213 0.128), oklab(52.6% 0.2 0.065), oklab(43.7% 0.173 0.027), oklab(33.1% 0.134 -0.001), oklab(21.6% 0.088 -0.03))

Fallback colors



background: linear-gradient(45deg, #FF2400, #C70039, #99003D, #660033, #330026)

Colors



<!-- Primary Colors -->
<color name="scarlet_night_color_10">#FF2400</color>
<color name="scarlet_night_color_20">#C70039</color>
<color name="scarlet_night_color_30">#99003D</color>
<color name="scarlet_night_color_40">#660033</color>
<color name="scarlet_night_color_50">#330026</color>

PWA prompt