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

#B45DFF #5100C7

Calculate the color between two colors, #B45DFF 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)

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

0.0%	0.0% #B45DFF	RGB 180 93 255	#B45DFF
16.7%	16.7% #A34DF5	RGB 163 77 245	#A34DF5
33.3%	33.3% #933EEC	RGB 147 62 236	#933EEC
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

#B45DFF #A34DF5 #933EEC #822EE3 #721ED9 #610FD0 #5100C7

#B45DFF - #5100C7

HSV Blend

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

0.0%	0.0% #B45DFF	RGB 180 93 255	#B45DFF
16.7%	16.7% #A24AF5	RGB 162 74 245	#A24AF5
33.3%	33.3% #9139EC	RGB 145 57 236	#9139EC
50.0%	50.0% #8129E3	RGB 129 41 227	#8129E3
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

#B45DFF #A24AF5 #9139EC #8129E3 #701AD9 #600CD0 #5100C7

#B45DFF - #8129E3 - #5100C7

CSS codes

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

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