Tree

#007016

#96bb7c

#d6efc7

#eeb40d

#feedbe

Actions

Explore the palette in different formats, and actions.

Colors overview

Green

Yellow

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#007016	rgb(0, 112, 22)	hsl(130 100% 22%)	oklab(47% -0.12 0.09)	oklch(47% 0.15 140)	color(display-p3 0.19 0.43 0.15)
	#96bb7c	rgb(150, 187, 124)	hsl(95 32% 61%)	oklab(75% -0.07 0.07)	oklch(75% 0.1 130)	color(display-p3 0.62 0.73 0.51)
	#d6efc7	rgb(214, 239, 199)	hsl(98 56% 86%)	oklab(92% -0.04 0.04)	oklch(92% 0.06 130)	color(display-p3 0.86 0.93 0.79)
	#eeb40d	rgb(238, 180, 13)	hsl(45 90% 49%)	oklab(80% 0.01 0.16)	oklch(80% 0.16 85)	color(display-p3 0.9 0.71 0.25)
	#feedbe	rgb(254, 237, 190)	hsl(44 97% 87%)	oklab(95% 0 0.06)	oklch(95% 0.06 91)	color(display-p3 0.98 0.93 0.77)

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

#007016

AA - 6.3



#96bb7c

AA - 2.16



#d6efc7

AA - 1.23



#eeb40d

AA - 1.88



#feedbe

AA - 1.16



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(47.3% -0.123 0.089), oklab(74.9% -0.065 0.07), oklab(92.3% -0.041 0.043), oklab(80.1% 0.015 0.162), oklab(94.8% -0.001 0.063))

Fallback colors



background: linear-gradient(45deg, #007016, #96bb7c, #d6efc7, #eeb40d, #feedbe)

Colors



<!-- Primary Colors -->
<color name="tree_color_10">#007016</color>
<color name="tree_color_20">#96bb7c</color>
<color name="tree_color_30">#d6efc7</color>
<color name="tree_color_40">#eeb40d</color>
<color name="tree_color_50">#feedbe</color>

PWA prompt