#BCA8FF - #5333CE | 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 #BCA8FF to #5333CE

#BCA8FF #5333CE

Calculate the color between two colors, #BCA8FF and #5333CE. 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)

#BCA8FF - #5333CE | 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 #BCA8FF as 0% and #5333CE as 100%.

0.0%	0.0% #BCA8FF	RGB 188 168 255	#BCA8FF
16.7%	16.7% #AA94F6	RGB 170 148 246	#AA94F6
33.3%	33.3% #9981EE	RGB 153 129 238	#9981EE
50.0%	50.0% #876DE6	RGB 135 109 230	#876DE6
66.7%	66.7% #765ADE	RGB 118 90 222	#765ADE
83.3%	83.3% #6446D6	RGB 100 70 214	#6446D6
100.0%	100.0% #5333CE	RGB 83 51 206	#5333CE

#BCA8FF #AA94F6 #9981EE #876DE6 #765ADE #6446D6 #5333CE

#BCA8FF - #5333CE

HSV Blend

#BCA8FF - #5333CE | 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 #BCA8FF as 0% and #5333CE as 100%.

0.0%	0.0% #BCA8FF	RGB 188 168 255	#BCA8FF
16.7%	16.7% #A891F6	RGB 168 145 246	#A891F6
33.3%	33.3% #957CEE	RGB 149 124 238	#957CEE
50.0%	50.0% #8368E6	RGB 131 104 230	#8368E6
66.7%	66.7% #7255DE	RGB 114 85 222	#7255DE
83.3%	83.3% #6243D6	RGB 98 67 214	#6243D6
100.0%	100.0% #5333CE	RGB 83 51 206	#5333CE

#BCA8FF #A891F6 #957CEE #8368E6 #7255DE #6243D6 #5333CE

#BCA8FF - #8368E6 - #5333CE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BCA8FF 0%, #8368E6 50%, #5333CE 100%);
    background: -webkit-linear-gradient(top, #BCA8FF 0%, #8368E6 50%, #5333CE 100%);
    background: linear-gradient(to bottom, #BCA8FF 0%, #8368E6 50%, #5333CE 100%);
}
</style>