#6CB3C4 - #8CFFB2 | 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 #6CB3C4 to #8CFFB2

#6CB3C4 #8CFFB2

Calculate the color between two colors, #6CB3C4 and #8CFFB2. 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)

#6CB3C4 - #8CFFB2 | 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 #6CB3C4 as 0% and #8CFFB2 as 100%.

0.0%	0.0% #6CB3C4	RGB 108 179 196	#6CB3C4
16.7%	16.7% #71BFC1	RGB 113 191 193	#71BFC1
33.3%	33.3% #76CCBE	RGB 118 204 190	#76CCBE
50.0%	50.0% #7CD9BB	RGB 124 217 187	#7CD9BB
66.7%	66.7% #81E5B8	RGB 129 229 184	#81E5B8
83.3%	83.3% #86F2B5	RGB 134 242 181	#86F2B5
100.0%	100.0% #8CFFB2	RGB 140 255 178	#8CFFB2

#6CB3C4 #71BFC1 #76CCBE #7CD9BB #81E5B8 #86F2B5 #8CFFB2

#6CB3C4 - #8CFFB2

HSV Blend

#6CB3C4 - #8CFFB2 | 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 #6CB3C4 as 0% and #8CFFB2 as 100%.

0.0%	0.0% #6CB3C4	RGB 108 179 196	#6CB3C4
16.7%	16.7% #71C9CD	RGB 113 201 205	#71C9CD
33.3%	33.3% #76D7CE	RGB 118 215 206	#76D7CE
50.0%	50.0% #7CE1C9	RGB 124 225 201	#7CE1C9
66.7%	66.7% #81EBC2	RGB 129 235 194	#81EBC2
83.3%	83.3% #86F5BB	RGB 134 245 187	#86F5BB
100.0%	100.0% #8CFFB2	RGB 140 255 178	#8CFFB2

#6CB3C4 #71C9CD #76D7CE #7CE1C9 #81EBC2 #86F5BB #8CFFB2

#6CB3C4 - #7CE1C9 - #8CFFB2

CSS codes

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

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