Pumpkin

#A0522D

#E97451

#F2D7D5

#2c0f02

Actions

Explore the palette in different formats, and actions.

Colors overview

Orange

Brown

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#a0522d	rgb(160, 82, 45)	hsl(19 56% 40%)	oklab(53% 0.08 0.08)	oklch(53% 0.12 45)	color(display-p3 0.59 0.34 0.21)
	#e97451	rgb(233, 116, 81)	hsl(14 78% 62%)	oklab(69% 0.12 0.09)	oklch(69% 0.15 37)	color(display-p3 0.85 0.48 0.35)
	#f2d7d5	rgb(242, 215, 213)	hsl(4.1 53% 89%)	oklab(90% 0.03 0.01)	oklch(90% 0.03 23)	color(display-p3 0.93 0.85 0.84)
	#2c0f02	rgb(44, 15, 2)	hsl(19 91% 9%)	oklab(21% 0.04 0.04)	oklch(21% 0.05 46)	color(display-p3 0.16 0.07 0.02)

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

#A0522D

AA - 5.61



#E97451

AA - 2.96



#F2D7D5

AA - 1.35



#2c0f02

AAA - 17.85



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(52.6% 0.082 0.081), oklab(68.9% 0.122 0.093), oklab(90.1% 0.028 0.012), oklab(21.2% 0.037 0.039))

Fallback colors



background: linear-gradient(45deg, #A0522D, #E97451, #F2D7D5, #2c0f02)

Colors



<!-- Primary Colors -->
<color name="pumpkin_color_10">#A0522D</color>
<color name="pumpkin_color_20">#E97451</color>
<color name="pumpkin_color_30">#F2D7D5</color>
<color name="pumpkin_color_40">#2c0f02</color>

PWA prompt