#B45CFF - #5100C7 | 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 #B45CFF to #5100C7

#B45CFF #5100C7

Calculate the color between two colors, #B45CFF and #5100C7. 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)

#B45CFF - #5100C7 | 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 #B45CFF as 0% and #5100C7 as 100%.

0.0%	0.0% #B45CFF	RGB 180 92 255	#B45CFF
16.7%	16.7% #A34CF5	RGB 163 76 245	#A34CF5
33.3%	33.3% #933DEC	RGB 147 61 236	#933DEC
50.0%	50.0% #822EE3	RGB 130 46 227	#822EE3
66.7%	66.7% #721ED9	RGB 114 30 217	#721ED9
83.3%	83.3% #610FD0	RGB 97 15 208	#610FD0
100.0%	100.0% #5100C7	RGB 81 0 199	#5100C7

#B45CFF #A34CF5 #933DEC #822EE3 #721ED9 #610FD0 #5100C7

#B45CFF - #5100C7

HSV Blend

#B45CFF - #5100C7 | 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 #B45CFF as 0% and #5100C7 as 100%.

0.0%	0.0% #B35BFF	RGB 179 91 255	#B35BFF
16.7%	16.7% #A249F5	RGB 162 73 245	#A249F5
33.3%	33.3% #9138EC	RGB 145 56 236	#9138EC
50.0%	50.0% #8128E3	RGB 129 40 227	#8128E3
66.7%	66.7% #701AD9	RGB 112 26 217	#701AD9
83.3%	83.3% #600CD0	RGB 96 12 208	#600CD0
100.0%	100.0% #5100C7	RGB 81 0 199	#5100C7

#B35BFF #A249F5 #9138EC #8128E3 #701AD9 #600CD0 #5100C7

#B45CFF - #8128E3 - #5100C7

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B35BFF 0%, #8128E3 50%, #5100C7 100%);
    background: -webkit-linear-gradient(top, #B35BFF 0%, #8128E3 50%, #5100C7 100%);
    background: linear-gradient(to bottom, #B35BFF 0%, #8128E3 50%, #5100C7 100%);
}
</style>