#CACAF7 - #657AC8 | 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 #CACAF7 to #657AC8

#CACAF7 #657AC8

Calculate the color between two colors, #CACAF7 and #657AC8. 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)

#CACAF7 - #657AC8 | 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 #CACAF7 as 0% and #657AC8 as 100%.

0.0%	0.0% #CACAF7	RGB 202 202 247	#CACAF7
16.7%	16.7% #B9BCEF	RGB 185 188 239	#B9BCEF
33.3%	33.3% #A8AFE7	RGB 168 175 231	#A8AFE7
50.0%	50.0% #97A2DF	RGB 151 162 223	#97A2DF
66.7%	66.7% #8694D7	RGB 134 148 215	#8694D7
83.3%	83.3% #7587CF	RGB 117 135 207	#7587CF
100.0%	100.0% #657AC8	RGB 101 122 200	#657AC8

#CACAF7 #B9BCEF #A8AFE7 #97A2DF #8694D7 #7587CF #657AC8

#CACAF7 - #657AC8

HSV Blend

#CACAF7 - #657AC8 | 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 #CACAF7 as 0% and #657AC8 as 100%.

0.0%	0.0% #CACAF7	RGB 202 202 247	#CACAF7
16.7%	16.7% #B7B9EF	RGB 183 185 239	#B7B9EF
33.3%	33.3% #A5A9E7	RGB 165 169 231	#A5A9E7
50.0%	50.0% #939BDF	RGB 147 155 223	#939BDF
66.7%	66.7% #838FD7	RGB 131 143 215	#838FD7
83.3%	83.3% #7384CF	RGB 115 132 207	#7384CF
100.0%	100.0% #657AC8	RGB 101 122 200	#657AC8

#CACAF7 #B7B9EF #A5A9E7 #939BDF #838FD7 #7384CF #657AC8

#CACAF7 - #939BDF - #657AC8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CACAF7 0%, #939BDF 50%, #657AC8 100%);
    background: -webkit-linear-gradient(top, #CACAF7 0%, #939BDF 50%, #657AC8 100%);
    background: linear-gradient(to bottom, #CACAF7 0%, #939BDF 50%, #657AC8 100%);
}
</style>