Fire

Actions

Explore the gradient in different formats, and actions.

Orange

Red

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK	Color schemes
	#e7792a	rgb(231, 121, 42)	hsl(25 80% 54%)	hwb(25 16% 9.4%)	lch(63 71.9 56.2)	lab(63 40 59.7)	cmyk 0%, 48%, 82%, 9%
	#f07086	rgb(240, 112, 134)	hsl(350 81% 69%)	hwb(350 44% 5.9%)	lch(63.7 53.3 14.2)	lab(63.7 51.7 13.1)	cmyk 0%, 53%, 44%, 6%

 Click a color format to copy to your clipboard.

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

#e7792a

AA - 2.93



#f07086

AA - 2.85



The simulation of color blindness may not be 100% accurate sometimes.

Colors preview as gradient with protanopia

Colors preview as palette with protanopia

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(69% 0.101 0.126), oklab(70.3% 0.155 0.031))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #e7792a, #f07086)

Colors



<!-- Primary Colors -->
<color name="fire_color_10">#e7792a</color>
<color name="fire_color_20">#f07086</color>

Gradient PRO

Pro feature only

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

PWA prompt