Teamwork

#3187D3

#62A4D0

#B0E4E7

#F8F3F2

#F76B98

Actions

Explore the palette in different formats, and actions.

Colors overview

Red

Blue

White

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#3187d3	rgb(49, 135, 211)	hsl(210 65% 51%)	oklab(61% -0.05 -0.13)	oklch(61% 0.14 250)	color(display-p3 0.29 0.52 0.8)
	#62a4d0	rgb(98, 164, 208)	hsl(200 54% 60%)	oklab(69% -0.05 -0.08)	oklch(69% 0.09 240)	color(display-p3 0.44 0.64 0.8)
	#b0e4e7	rgb(176, 228, 231)	hsl(180 53% 80%)	oklab(88% -0.05 -0.02)	oklch(88% 0.05 200)	color(display-p3 0.73 0.89 0.9)
	#f8f3f2	rgb(248, 243, 242)	hsl(10 30% 96%)	oklab(97% 0 0)	oklch(97% 0.01 31)	color(display-p3 0.97 0.95 0.95)
	#f76b98	rgb(247, 107, 152)	hsl(340 90% 69%)	oklab(71% 0.18 0.01)	oklch(71% 0.18 2.5)	color(display-p3 0.9 0.45 0.59)

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

#3187D3

AA - 3.79



#62A4D0

AA - 2.71



#B0E4E7

AA - 1.39



#F8F3F2

AA - 1.09



#F76B98

AA - 2.79



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(60.9% -0.05 -0.132), oklab(69.2% -0.048 -0.081), oklab(88.4% -0.05 -0.019), oklab(96.8% 0.005 0.003), oklab(71.1% 0.176 0.008))

Fallback colors



background: linear-gradient(45deg, #3187D3, #62A4D0, #B0E4E7, #F8F3F2, #F76B98)

Colors



<!-- Primary Colors -->
<color name="teamwork_color_10">#3187D3</color>
<color name="teamwork_color_20">#62A4D0</color>
<color name="teamwork_color_30">#B0E4E7</color>
<color name="teamwork_color_40">#F8F3F2</color>
<color name="teamwork_color_50">#F76B98</color>

PWA prompt