#22613e

#28ba72

#99dbb0

Seagreen



Web code

Get CSS, SCSS, & Tailwind code for development



App tokens

Get Android, Flutter, Swift, & MAUI tokens



HDR gradient

Switch to HDR to enhance the gradient



Quick view

Inspect colors in multiple color spaces

Colors overview

Green

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#22613e	rgb(34, 97, 62)	hsl(150 48% 26%)	hwb(150 13% 62%)	lch(36.4 31.1 154)	lab(36.4 -27.8 13.8)	cmyk 65%, 0%, 36%, 62%
	#28ba72	rgb(40, 186, 114)	hsl(150 65% 44%)	hwb(150 16% 27%)	lch(67 57.3 154)	lab(67 -51.3 25.5)	cmyk 78%, 0%, 39%, 27%
	#99dbb0	rgb(153, 219, 176)	hsl(140 48% 73%)	hwb(140 60% 14%)	lch(82.1 31.7 153)	lab(82.1 -28.3 14.3)	cmyk 30%, 0%, 20%, 14%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#22613e

AAA - 7.37



#28ba72

AA - 2.51



#99dbb0

AA - 1.6



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(44.2% -0.079 0.036), oklab(69.8% -0.145 0.065), oklab(83.5% -0.082 0.038))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #22613e, #28ba72, #99dbb0)

Colors



<!-- Primary Colors -->
<color name="seagreen_color_10">#22613e</color>
<color name="seagreen_color_20">#28ba72</color>
<color name="seagreen_color_30">#99dbb0</color>

Gradient PRO

Pro feature only

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

PWA prompt