#AFC1FF - #3E57CE | 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 #AFC1FF to #3E57CE

#AFC1FF #3E57CE

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

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

0.0%	0.0% #AFC1FF	RGB 175 193 255	#AFC1FF
16.7%	16.7% #9CAFF6	RGB 156 175 246	#9CAFF6
33.3%	33.3% #899DEE	RGB 137 157 238	#899DEE
50.0%	50.0% #768CE6	RGB 118 140 230	#768CE6
66.7%	66.7% #637ADE	RGB 99 122 222	#637ADE
83.3%	83.3% #5068D6	RGB 80 104 214	#5068D6
100.0%	100.0% #3E57CE	RGB 62 87 206	#3E57CE

#AFC1FF #9CAFF6 #899DEE #768CE6 #637ADE #5068D6 #3E57CE

#AFC1FF - #3E57CE

HSV Blend

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

0.0%	0.0% #AFC1FF	RGB 175 193 255	#AFC1FF
16.7%	16.7% #99ADF6	RGB 153 173 246	#99ADF6
33.3%	33.3% #859BEE	RGB 133 155 238	#859BEE
50.0%	50.0% #7189E6	RGB 113 137 230	#7189E6
66.7%	66.7% #5F77DE	RGB 95 119 222	#5F77DE
83.3%	83.3% #4E66D6	RGB 78 102 214	#4E66D6
100.0%	100.0% #3E57CE	RGB 62 87 206	#3E57CE

#AFC1FF #99ADF6 #859BEE #7189E6 #5F77DE #4E66D6 #3E57CE

#AFC1FF - #7189E6 - #3E57CE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AFC1FF 0%, #7189E6 50%, #3E57CE 100%);
    background: -webkit-linear-gradient(top, #AFC1FF 0%, #7189E6 50%, #3E57CE 100%);
    background: linear-gradient(to bottom, #AFC1FF 0%, #7189E6 50%, #3E57CE 100%);
}
</style>