#BACBFF - #4D66CF | 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 #BACBFF to #4D66CF

#BACBFF #4D66CF

Calculate the color between two colors, #BACBFF and #4D66CF. 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)

#BACBFF - #4D66CF | 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 #BACBFF as 0% and #4D66CF as 100%.

0.0%	0.0% #BACBFF	RGB 186 203 255	#BACBFF
16.7%	16.7% #A7BAF7	RGB 167 186 247	#A7BAF7
33.3%	33.3% #95A9EF	RGB 149 169 239	#95A9EF
50.0%	50.0% #8398E7	RGB 131 152 231	#8398E7
66.7%	66.7% #7187DF	RGB 113 135 223	#7187DF
83.3%	83.3% #5F76D7	RGB 95 118 215	#5F76D7
100.0%	100.0% #4D66CF	RGB 77 102 207	#4D66CF

#BACBFF #A7BAF7 #95A9EF #8398E7 #7187DF #5F76D7 #4D66CF

#BACBFF - #4D66CF

HSV Blend

#BACBFF - #4D66CF | 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 #BACBFF as 0% and #4D66CF as 100%.

0.0%	0.0% #BACBFF	RGB 186 203 255	#BACBFF
16.7%	16.7% #A5B8F7	RGB 165 184 247	#A5B8F7
33.3%	33.3% #91A7EF	RGB 145 167 239	#91A7EF
50.0%	50.0% #7F95E7	RGB 127 149 231	#7F95E7
66.7%	66.7% #6D85DF	RGB 109 133 223	#6D85DF
83.3%	83.3% #5C75D7	RGB 92 117 215	#5C75D7
100.0%	100.0% #4D66CF	RGB 77 102 207	#4D66CF

#BACBFF #A5B8F7 #91A7EF #7F95E7 #6D85DF #5C75D7 #4D66CF

#BACBFF - #7F95E7 - #4D66CF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BACBFF 0%, #7F95E7 50%, #4D66CF 100%);
    background: -webkit-linear-gradient(top, #BACBFF 0%, #7F95E7 50%, #4D66CF 100%);
    background: linear-gradient(to bottom, #BACBFF 0%, #7F95E7 50%, #4D66CF 100%);
}
</style>