Forest

#584639

#886956

#a3826d

#458c48

#2b4f2b

Actions

Explore the palette in different formats, and actions.

Colors overview

Brown

Green

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#584639	rgb(88, 70, 57)	hsl(25 21% 28%)	oklab(41% 0.02 0.03)	oklch(41% 0.03 58)	color(display-p3 0.33 0.28 0.23)
	#886956	rgb(136, 105, 86)	hsl(23 23% 44%)	oklab(55% 0.03 0.04)	oklch(55% 0.05 53)	color(display-p3 0.51 0.42 0.35)
	#a3826d	rgb(163, 130, 109)	hsl(23 23% 53%)	oklab(63% 0.03 0.04)	oklch(63% 0.05 54)	color(display-p3 0.62 0.51 0.44)
	#458c48	rgb(69, 140, 72)	hsl(120 34% 41%)	oklab(58% -0.1 0.07)	oklch(58% 0.12 140)	color(display-p3 0.34 0.54 0.31)
	#2b4f2b	rgb(43, 79, 43)	hsl(120 30% 24%)	oklab(39% -0.06 0.04)	oklch(39% 0.07 140)	color(display-p3 0.2 0.31 0.18)

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

#584639

AAA - 8.93



#886956

AA - 4.99



#a3826d

AA - 3.51



#458c48

AA - 4.11



#2b4f2b

AAA - 9.3



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(40.9% 0.017 0.027), oklab(54.7% 0.03 0.039), oklab(63.2% 0.03 0.041), oklab(57.7% -0.101 0.072), oklab(39% -0.059 0.043))

Fallback colors



background: linear-gradient(45deg, #584639, #886956, #a3826d, #458c48, #2b4f2b)

Colors



<!-- Primary Colors -->
<color name="forest_color_10">#584639</color>
<color name="forest_color_20">#886956</color>
<color name="forest_color_30">#a3826d</color>
<color name="forest_color_40">#458c48</color>
<color name="forest_color_50">#2b4f2b</color>

PWA prompt