#6C97C4 - #8CFFD5 | 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 #6C97C4 to #8CFFD5

#6C97C4 #8CFFD5

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

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

0.0%	0.0% #6C97C4	RGB 108 151 196	#6C97C4
16.7%	16.7% #71A8C6	RGB 113 168 198	#71A8C6
33.3%	33.3% #76B9C9	RGB 118 185 201	#76B9C9
50.0%	50.0% #7CCBCC	RGB 124 203 204	#7CCBCC
66.7%	66.7% #81DCCF	RGB 129 220 207	#81DCCF
83.3%	83.3% #86EDD2	RGB 134 237 210	#86EDD2
100.0%	100.0% #8CFFD5	RGB 140 255 213	#8CFFD5

#6C97C4 #71A8C6 #76B9C9 #7CCBCC #81DCCF #86EDD2 #8CFFD5

#6C97C4 - #8CFFD5

HSV Blend

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

0.0%	0.0% #6C96C4	RGB 108 150 196	#6C96C4
16.7%	16.7% #71ACCD	RGB 113 172 205	#71ACCD
33.3%	33.3% #76C2D7	RGB 118 194 215	#76C2D7
50.0%	50.0% #7CDAE1	RGB 124 218 225	#7CDAE1
66.7%	66.7% #81EBE3	RGB 129 235 227	#81EBE3
83.3%	83.3% #86F5DC	RGB 134 245 220	#86F5DC
100.0%	100.0% #8CFFD5	RGB 140 255 213	#8CFFD5

#6C96C4 #71ACCD #76C2D7 #7CDAE1 #81EBE3 #86F5DC #8CFFD5

#6C97C4 - #7CDAE1 - #8CFFD5

CSS codes

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

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