#E88C4A

#E07A37

#D86825

#CC5613

Pumpkin Pie



Web code

Get CSS, SCSS, & Tailwind code for development



App tokens

Get Android, Flutter, Swift, & MAUI tokens



HDR gradient

Switch to HDR to enhance the gradient



Quick view

Inspect colors in multiple color spaces

Colors overview

Orange

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#e88c4a	rgb(232, 140, 74)	hsl(25 77% 60%)	hwb(25 29% 9%)	lch(67.4 59.2 57.3)	lab(67.4 31.9 49.8)	cmyk 0%, 40%, 68%, 9%
	#e07a37	rgb(224, 122, 55)	hsl(24 73% 55%)	hwb(24 22% 12%)	lch(62.3 64.8 55.1)	lab(62.3 37 53.2)	cmyk 0%, 46%, 75%, 12%
	#d86825	rgb(216, 104, 37)	hsl(22 71% 50%)	hwb(22 15% 15%)	lch(57.4 70.1 53)	lab(57.4 42.2 56)	cmyk 0%, 52%, 83%, 15%
	#cc5613	rgb(204, 86, 19)	hsl(22 83% 44%)	hwb(22 7.5% 20%)	lch(52 73.4 51.5)	lab(52 45.7 57.4)	cmyk 0%, 58%, 91%, 20%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#E88C4A

AA - 2.53



#E07A37

AA - 2.99



#D86825

AA - 3.54



#CC5613

AA - 4.27



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(72.5% 0.081 0.112), oklab(68.3% 0.094 0.116), oklab(64.2% 0.109 0.117), oklab(59.7% 0.119 0.115))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #E88C4A, #E07A37, #D86825, #CC5613)

Colors



<!-- Primary Colors -->
<color name="pumpkin_pie_color_10">#E88C4A</color>
<color name="pumpkin_pie_color_20">#E07A37</color>
<color name="pumpkin_pie_color_30">#D86825</color>
<color name="pumpkin_pie_color_40">#CC5613</color>

Gradient PRO

Pro feature only

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

PWA prompt