Cyan

#76e89e

#c7fcda

#4f96e8

#7ee3f7

#4f4f4f

Actions

Explore the palette in different formats, and actions.

Colors overview

Green

Blue

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#76e89e	rgb(118, 232, 158)	hsl(140 71% 69%)	oklab(84% -0.13 0.07)	oklch(84% 0.15 150)	color(display-p3 0.58 0.9 0.64)
	#c7fcda	rgb(199, 252, 218)	hsl(140 90% 88%)	oklab(95% -0.06 0.03)	oklch(95% 0.07 160)	color(display-p3 0.82 0.98 0.86)
	#4f96e8	rgb(79, 150, 232)	hsl(210 77% 61%)	oklab(66% -0.04 -0.14)	oklch(66% 0.14 250)	color(display-p3 0.38 0.58 0.89)
	#7ee3f7	rgb(126, 227, 247)	hsl(190 88% 73%)	oklab(86% -0.08 -0.05)	oklch(86% 0.1 210)	color(display-p3 0.59 0.88 0.96)
	#4f4f4f	rgb(79, 79, 79)	hsl(none 0% 31%)	oklab(43% 0 0)	oklch(43% 0 none)	color(display-p3 0.31 0.31 0.31)

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

#76e89e

AA - 1.52



#c7fcda

AA - 1.14



#4f96e8

AA - 3.06



#7ee3f7

AA - 1.47



#4f4f4f

AAA - 8.19



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(84.5% -0.132 0.066), oklab(94.6% -0.065 0.028), oklab(66.4% -0.04 -0.136), oklab(86.2% -0.084 -0.052), oklab(42.8% 0 0))

Fallback colors



background: linear-gradient(45deg, #76e89e, #c7fcda, #4f96e8, #7ee3f7, #4f4f4f)

Colors



<!-- Primary Colors -->
<color name="cyan_color_10">#76e89e</color>
<color name="cyan_color_20">#c7fcda</color>
<color name="cyan_color_30">#4f96e8</color>
<color name="cyan_color_40">#7ee3f7</color>
<color name="cyan_color_50">#4f4f4f</color>

PWA prompt