#BB9EFF - #5A36D0 | 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 #BB9EFF to #5A36D0

#BB9EFF #5A36D0

Calculate the color between two colors, #BB9EFF and #5A36D0. 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)

#BB9EFF - #5A36D0 | 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 #BB9EFF as 0% and #5A36D0 as 100%.

0.0%	0.0% #BB9EFF	RGB 187 158 255	#BB9EFF
16.7%	16.7% #AA8CF7	RGB 170 140 247	#AA8CF7
33.3%	33.3% #9A7BEF	RGB 154 123 239	#9A7BEF
50.0%	50.0% #8A6AE7	RGB 138 106 231	#8A6AE7
66.7%	66.7% #7A58DF	RGB 122 88 223	#7A58DF
83.3%	83.3% #6A47D7	RGB 106 71 215	#6A47D7
100.0%	100.0% #5A36D0	RGB 90 54 208	#5A36D0

#BB9EFF #AA8CF7 #9A7BEF #8A6AE7 #7A58DF #6A47D7 #5A36D0

#BB9EFF - #5A36D0

HSV Blend

#BB9EFF - #5A36D0 | 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 #BB9EFF as 0% and #5A36D0 as 100%.

0.0%	0.0% #BB9EFF	RGB 187 158 255	#BB9EFF
16.7%	16.7% #A98AF7	RGB 169 138 247	#A98AF7
33.3%	33.3% #9877EF	RGB 152 119 239	#9877EF
50.0%	50.0% #8865E7	RGB 136 101 231	#8865E7
66.7%	66.7% #7854DF	RGB 120 84 223	#7854DF
83.3%	83.3% #6844D7	RGB 104 68 215	#6844D7
100.0%	100.0% #5A36D0	RGB 90 54 208	#5A36D0

#BB9EFF #A98AF7 #9877EF #8865E7 #7854DF #6844D7 #5A36D0

#BB9EFF - #8865E7 - #5A36D0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BB9EFF 0%, #8865E7 50%, #5A36D0 100%);
    background: -webkit-linear-gradient(top, #BB9EFF 0%, #8865E7 50%, #5A36D0 100%);
    background: linear-gradient(to bottom, #BB9EFF 0%, #8865E7 50%, #5A36D0 100%);
}
</style>