#2ee8ff

#2ebeff

#2e94ff

Turquoise



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

Cyan

Blue

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#2ee8ff	rgb(46, 232, 255)	hsl(190 100% 59%)	hwb(190 18% 0%)	lch(84.2 46.7 212)	lab(84.2 -39.7 -24.5)	cmyk 82%, 9%, 0%, 0%
	#2ebeff	rgb(46, 190, 255)	hsl(200 100% 59%)	hwb(200 18% 0%)	lch(71.9 48.3 244)	lab(71.9 -21.3 -43.3)	cmyk 82%, 25%, 0%, 0%
	#2e94ff	rgb(46, 148, 255)	hsl(210 100% 59%)	hwb(210 18% 0%)	lch(59.8 62.5 270)	lab(59.8 0.006 -62.5)	cmyk 82%, 42%, 0%, 0%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#2ee8ff

AA - 1.48



#2ebeff

AA - 2.11



#2e94ff

AA - 3.08



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(85.4% -0.123 -0.066), oklab(75.7% -0.086 -0.12), oklab(66.4% -0.052 -0.175))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #2ee8ff, #2ebeff, #2e94ff)

Colors



<!-- Primary Colors -->
<color name="turquoise_color_10">#2ee8ff</color>
<color name="turquoise_color_20">#2ebeff</color>
<color name="turquoise_color_30">#2e94ff</color>

Gradient PRO

Pro feature only

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

PWA prompt