#3C9ABE - #C7E2EC | 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 #3C9ABE to #C7E2EC

#3C9ABE #C7E2EC

Calculate the color between two colors, #3C9ABE and #C7E2EC. 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)

#3C9ABE - #C7E2EC | 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 #3C9ABE as 0% and #C7E2EC as 100%.

0.0%	0.0% #3C9ABE	RGB 60 154 190	#3C9ABE
16.7%	16.7% #53A6C5	RGB 83 166 197	#53A6C5
33.3%	33.3% #6AB2CD	RGB 106 178 205	#6AB2CD
50.0%	50.0% #81BED5	RGB 129 190 213	#81BED5
66.7%	66.7% #98CADC	RGB 152 202 220	#98CADC
83.3%	83.3% #AFD6E4	RGB 175 214 228	#AFD6E4
100.0%	100.0% #C7E2EC	RGB 199 226 236	#C7E2EC

#3C9ABE #53A6C5 #6AB2CD #81BED5 #98CADC #AFD6E4 #C7E2EC

#3C9ABE - #C7E2EC

HSV Blend

#3C9ABE - #C7E2EC | 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 #3C9ABE as 0% and #C7E2EC as 100%.

0.0%	0.0% #3C9ABE	RGB 60 154 190	#3C9ABE
16.7%	16.7% #4FA5C5	RGB 79 165 197	#4FA5C5
33.3%	33.3% #64B0CD	RGB 100 176 205	#64B0CD
50.0%	50.0% #7BBCD5	RGB 123 188 213	#7BBCD5
66.7%	66.7% #93C8DC	RGB 147 200 220	#93C8DC
83.3%	83.3% #ACD5E4	RGB 172 213 228	#ACD5E4
100.0%	100.0% #C7E2EC	RGB 199 226 236	#C7E2EC

#3C9ABE #4FA5C5 #64B0CD #7BBCD5 #93C8DC #ACD5E4 #C7E2EC

#3C9ABE - #7BBCD5 - #C7E2EC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C9ABE 0%, #7BBCD5 50%, #C7E2EC 100%);
    background: -webkit-linear-gradient(top, #3C9ABE 0%, #7BBCD5 50%, #C7E2EC 100%);
    background: linear-gradient(to bottom, #3C9ABE 0%, #7BBCD5 50%, #C7E2EC 100%);
}
</style>