#3E64C1 - #C7D1ED | 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 #3E64C1 to #C7D1ED

#3E64C1 #C7D1ED

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

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

0.0%	0.0% #3E64C1	RGB 62 100 193	#3E64C1
16.7%	16.7% #5476C8	RGB 84 118 200	#5476C8
33.3%	33.3% #6B88CF	RGB 107 136 207	#6B88CF
50.0%	50.0% #829AD7	RGB 130 154 215	#829AD7
66.7%	66.7% #99ACDE	RGB 153 172 222	#99ACDE
83.3%	83.3% #B0BEE5	RGB 176 190 229	#B0BEE5
100.0%	100.0% #C7D1ED	RGB 199 209 237	#C7D1ED

#3E64C1 #5476C8 #6B88CF #829AD7 #99ACDE #B0BEE5 #C7D1ED

#3E64C1 - #C7D1ED

HSV Blend

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

0.0%	0.0% #3E64C1	RGB 62 100 193	#3E64C1
16.7%	16.7% #5173C8	RGB 81 115 200	#5173C8
33.3%	33.3% #6684CF	RGB 102 132 207	#6684CF
50.0%	50.0% #7C95D7	RGB 124 149 215	#7C95D7
66.7%	66.7% #94A8DE	RGB 148 168 222	#94A8DE
83.3%	83.3% #ACBCE5	RGB 172 188 229	#ACBCE5
100.0%	100.0% #C7D1ED	RGB 199 209 237	#C7D1ED

#3E64C1 #5173C8 #6684CF #7C95D7 #94A8DE #ACBCE5 #C7D1ED

#3E64C1 - #7C95D7 - #C7D1ED

CSS codes

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

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