Shaggy

#E8A516

#FCC891

#B1BA1F

#837B02

#AE553D

Actions

Explore the palette in different formats, and actions.

Colors overview

Green

Brown

Orange

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#e8a516	rgb(232, 165, 22)	hsl(41 83% 50%)	oklab(77% 0.03 0.15)	oklch(77% 0.16 79)	color(display-p3 0.87 0.66 0.24)
	#fcc891	rgb(252, 200, 145)	hsl(31 95% 78%)	oklab(87% 0.03 0.09)	oklch(87% 0.09 68)	color(display-p3 0.96 0.79 0.6)
	#b1ba1f	rgb(177, 186, 31)	hsl(63 71% 43%)	oklab(76% -0.06 0.15)	oklch(76% 0.16 110)	color(display-p3 0.7 0.73 0.26)
	#837b02	rgb(131, 123, 2)	hsl(56 97% 26%)	oklab(57% -0.03 0.12)	oklch(57% 0.12 110)	color(display-p3 0.51 0.48 0.15)
	#ae553d	rgb(174, 85, 61)	hsl(13 48% 46%)	oklab(55% 0.1 0.07)	oklch(55% 0.12 36)	color(display-p3 0.64 0.35 0.26)

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

#E8A516

AA - 2.13



#FCC891

AA - 1.52



#B1BA1F

AA - 2.11



#837B02

AA - 4.37



#AE553D

AA - 5.04



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(76.7% 0.031 0.152), oklab(86.6% 0.035 0.085), oklab(75.7% -0.064 0.149), oklab(57.2% -0.031 0.117), oklab(55.4% 0.099 0.072))

Fallback colors



background: linear-gradient(45deg, #E8A516, #FCC891, #B1BA1F, #837B02, #AE553D)

Colors



<!-- Primary Colors -->
<color name="shaggy_color_10">#E8A516</color>
<color name="shaggy_color_20">#FCC891</color>
<color name="shaggy_color_30">#B1BA1F</color>
<color name="shaggy_color_40">#837B02</color>
<color name="shaggy_color_50">#AE553D</color>

PWA prompt