#3E84C0 - #C7DBED | 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 #3E84C0 to #C7DBED

#3E84C0 #C7DBED

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

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

0.0%	0.0% #3E84C0	RGB 62 132 192	#3E84C0
16.7%	16.7% #5492C7	RGB 84 146 199	#5492C7
33.3%	33.3% #6BA1CF	RGB 107 161 207	#6BA1CF
50.0%	50.0% #82AFD6	RGB 130 175 214	#82AFD6
66.7%	66.7% #99BEDE	RGB 153 190 222	#99BEDE
83.3%	83.3% #B0CCE5	RGB 176 204 229	#B0CCE5
100.0%	100.0% #C7DBED	RGB 199 219 237	#C7DBED

#3E84C0 #5492C7 #6BA1CF #82AFD6 #99BEDE #B0CCE5 #C7DBED

#3E84C0 - #C7DBED

HSV Blend

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

0.0%	0.0% #3E84C0	RGB 62 132 192	#3E84C0
16.7%	16.7% #5190C7	RGB 81 144 199	#5190C7
33.3%	33.3% #669ECF	RGB 102 158 207	#669ECF
50.0%	50.0% #7CACD6	RGB 124 172 214	#7CACD6
66.7%	66.7% #94BBDE	RGB 148 187 222	#94BBDE
83.3%	83.3% #ACCAE5	RGB 172 202 229	#ACCAE5
100.0%	100.0% #C7DBED	RGB 199 219 237	#C7DBED

#3E84C0 #5190C7 #669ECF #7CACD6 #94BBDE #ACCAE5 #C7DBED

#3E84C0 - #7CACD6 - #C7DBED

CSS codes

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

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