#6CC2B6 - #8CEAFF | colorate

colorate is a color scheme tool for designers and developers. This will help you draw inspiration and serve as a resource for your color work. Make this site better

Blend #6CC2B6 to #8CEAFF

#6CC2B6 #8CEAFF

Calculate the color between two colors, #6CC2B6 and #8CEAFF. In calculation of RGB values, saturation between the dissimilar colors is low. In calculating of HSV values, saturation between the dissimilar colors is not low.

RGB Blend(Linear)

#6CC2B6 - #8CEAFF | colorate

Calculation of color between two colors based on RGB value. For colors that are distant from each other, the saturation between the two colors decreases. Expand the color between two colors with #6CC2B6 as 0% and #8CEAFF as 100%.

0.0%	0.0% #6CC2B6	RGB 108 194 182	#6CC2B6
16.7%	16.7% #71C8C2	RGB 113 200 194	#71C8C2
33.3%	33.3% #76CFCE	RGB 118 207 206	#76CFCE
50.0%	50.0% #7CD6DA	RGB 124 214 218	#7CD6DA
66.7%	66.7% #81DCE6	RGB 129 220 230	#81DCE6
83.3%	83.3% #86E3F2	RGB 134 227 242	#86E3F2
100.0%	100.0% #8CEAFF	RGB 140 234 255	#8CEAFF

#6CC2B6 #71C8C2 #76CFCE #7CD6DA #81DCE6 #86E3F2 #8CEAFF

#6CC2B6 - #8CEAFF

HSV Blend

#6CC2B6 - #8CEAFF | colorate

Calculation of color between two colors based on HSV value. Even between distinct colors of color, the saturation between the two colors does not decrease. Expand the color between two colors with #6CC2B6 as 0% and #8CEAFF as 100%.

0.0%	0.0% #6CC2B6	RGB 108 194 182	#6CC2B6
16.7%	16.7% #71CCC4	RGB 113 204 196	#71CCC4
33.3%	33.3% #76D6D3	RGB 118 214 211	#76D6D3
50.0%	50.0% #7CDEE0	RGB 124 222 224	#7CDEE0
66.7%	66.7% #81E2EA	RGB 129 226 234	#81E2EA
83.3%	83.3% #86E6F4	RGB 134 230 244	#86E6F4
100.0%	100.0% #8CEAFF	RGB 140 234 255	#8CEAFF

#6CC2B6 #71CCC4 #76D6D3 #7CDEE0 #81E2EA #86E6F4 #8CEAFF

#6CC2B6 - #7CDEE0 - #8CEAFF

CSS codes

<style type="text/css">
/* RGB Gradient */
div {
    background: -moz-linear-gradient(top, #6CC2B6 0%, #8CEAFF 100%);
    background: -webkit-linear-gradient(top, #6CC2B6 0%, #8CEAFF 100%);
    background: linear-gradient(to bottom, #6CC2B6 0%, #8CEAFF 100%);
}

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6CC2B6 0%, #7CDEE0 50%, #8CEAFF 100%);
    background: -webkit-linear-gradient(top, #6CC2B6 0%, #7CDEE0 50%, #8CEAFF 100%);
    background: linear-gradient(to bottom, #6CC2B6 0%, #7CDEE0 50%, #8CEAFF 100%);
}
</style>