#3E86EC - #8DCBF4 | 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 #3E86EC to #8DCBF4

#3E86EC #8DCBF4

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

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

0.0%	0.0% #3E86EC	RGB 62 134 236	#3E86EC
16.7%	16.7% #4B91ED	RGB 75 145 237	#4B91ED
33.3%	33.3% #589DEE	RGB 88 157 238	#589DEE
50.0%	50.0% #65A8F0	RGB 101 168 240	#65A8F0
66.7%	66.7% #72B4F1	RGB 114 180 241	#72B4F1
83.3%	83.3% #7FBFF2	RGB 127 191 242	#7FBFF2
100.0%	100.0% #8DCBF4	RGB 141 203 244	#8DCBF4

#3E86EC #4B91ED #589DEE #65A8F0 #72B4F1 #7FBFF2 #8DCBF4

#3E86EC - #8DCBF4

HSV Blend

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

0.0%	0.0% #3E86EC	RGB 62 134 236	#3E86EC
16.7%	16.7% #4A93ED	RGB 74 147 237	#4A93ED
33.3%	33.3% #579FEE	RGB 87 159 238	#579FEE
50.0%	50.0% #64ABF0	RGB 100 171 240	#64ABF0
66.7%	66.7% #72B6F1	RGB 114 182 241	#72B6F1
83.3%	83.3% #7FC1F2	RGB 127 193 242	#7FC1F2
100.0%	100.0% #8DCBF4	RGB 141 203 244	#8DCBF4

#3E86EC #4A93ED #579FEE #64ABF0 #72B6F1 #7FC1F2 #8DCBF4

#3E86EC - #64ABF0 - #8DCBF4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3E86EC 0%, #64ABF0 50%, #8DCBF4 100%);
    background: -webkit-linear-gradient(top, #3E86EC 0%, #64ABF0 50%, #8DCBF4 100%);
    background: linear-gradient(to bottom, #3E86EC 0%, #64ABF0 50%, #8DCBF4 100%);
}
</style>