#8DCCE2 - #3C8DBC | 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 #8DCCE2 to #3C8DBC

#8DCCE2 #3C8DBC

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

#8DCCE2 - #3C8DBC | 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 #8DCCE2 as 0% and #3C8DBC as 100%.

0.0%	0.0% #8DCCE2	RGB 141 204 226	#8DCCE2
16.7%	16.7% #7FC1DB	RGB 127 193 219	#7FC1DB
33.3%	33.3% #72B7D5	RGB 114 183 213	#72B7D5
50.0%	50.0% #64ACCF	RGB 100 172 207	#64ACCF
66.7%	66.7% #57A2C8	RGB 87 162 200	#57A2C8
83.3%	83.3% #4997C2	RGB 73 151 194	#4997C2
100.0%	100.0% #3C8DBC	RGB 60 141 188	#3C8DBC

#8DCCE2 #7FC1DB #72B7D5 #64ACCF #57A2C8 #4997C2 #3C8DBC

#8DCCE2 - #3C8DBC

HSV Blend

#8DCCE2 - #3C8DBC | 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 #8DCCE2 as 0% and #3C8DBC as 100%.

0.0%	0.0% #8DCCE2	RGB 141 204 226	#8DCCE2
16.7%	16.7% #7DC1DB	RGB 125 193 219	#7DC1DB
33.3%	33.3% #6FB7D5	RGB 111 183 213	#6FB7D5
50.0%	50.0% #61ACCF	RGB 97 172 207	#61ACCF
66.7%	66.7% #54A2C8	RGB 84 162 200	#54A2C8
83.3%	83.3% #4797C2	RGB 71 151 194	#4797C2
100.0%	100.0% #3C8DBC	RGB 60 141 188	#3C8DBC

#8DCCE2 #7DC1DB #6FB7D5 #61ACCF #54A2C8 #4797C2 #3C8DBC

#8DCCE2 - #61ACCF - #3C8DBC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8DCCE2 0%, #61ACCF 50%, #3C8DBC 100%);
    background: -webkit-linear-gradient(top, #8DCCE2 0%, #61ACCF 50%, #3C8DBC 100%);
    background: linear-gradient(to bottom, #8DCCE2 0%, #61ACCF 50%, #3C8DBC 100%);
}
</style>