Snake Color Gradient

 #336600

 #58870c

 #8bb518

 #adb928

 #c9cf2f

Colors overview

Yellow

Green

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#336600	rgb(51, 102, 0)	hsl(90 100% 20%)	hwb(90 0% 60%)	lch(38.3 52.4 125)	lab(38.3 -30 43)	cmyk 50%, 0%, 100%, 60%
	#58870c	rgb(88, 135, 12)	hsl(83 84% 29%)	hwb(83 4.7% 47%)	lch(51.3 59.7 120)	lab(51.3 -29.7 51.7)	cmyk 35%, 0%, 91%, 47%
	#8bb518	rgb(139, 181, 24)	hsl(76 77% 40%)	hwb(76 9.4% 29%)	lch(68.7 71.3 114)	lab(68.7 -29.4 64.9)	cmyk 23%, 0%, 87%, 29%
	#adb928	rgb(173, 185, 40)	hsl(65 64% 44%)	hwb(65 16% 27%)	lch(72.4 67.4 104)	lab(72.4 -16.9 65.3)	cmyk 6%, 0%, 78%, 27%
	#c9cf2f	rgb(201, 207, 47)	hsl(62 63% 50%)	hwb(62 18% 19%)	lch(80.7 73.1 102)	lab(80.7 -15.3 71.5)	cmyk 3%, 0%, 77%, 19%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#336600

AA - 6.9



#58870c

AA - 4.29



#8bb518

AA - 2.4



#adb928

AA - 2.15



#c9cf2f

AA - 1.68



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(45.6% -0.094 0.094), oklab(56.8% -0.096 0.114), oklab(71.7% -0.1 0.143), oklab(75.2% -0.066 0.144), oklab(82.3% -0.063 0.157))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #336600, #58870c, #8bb518, #adb928, #c9cf2f)

Colors



<!-- Primary Colors -->
<color name="snake_color_10">#336600</color>
<color name="snake_color_20">#58870c</color>
<color name="snake_color_30">#8bb518</color>
<color name="snake_color_40">#adb928</color>
<color name="snake_color_50">#c9cf2f</color>

Gradient PRO

Pro feature only

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

PWA prompt