#AB7DF3 - #560AB6 | 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 #AB7DF3 to #560AB6

#AB7DF3 #560AB6

Calculate the color between two colors, #AB7DF3 and #560AB6. 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)

#AB7DF3 - #560AB6 | 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 #AB7DF3 as 0% and #560AB6 as 100%.

0.0%	0.0% #AB7DF3	RGB 171 125 243	#AB7DF3
16.7%	16.7% #9C69E8	RGB 156 105 232	#9C69E8
33.3%	33.3% #8E56DE	RGB 142 86 222	#8E56DE
50.0%	50.0% #8043D4	RGB 128 67 212	#8043D4
66.7%	66.7% #7230CA	RGB 114 48 202	#7230CA
83.3%	83.3% #641DC0	RGB 100 29 192	#641DC0
100.0%	100.0% #560AB6	RGB 86 10 182	#560AB6

#AB7DF3 #9C69E8 #8E56DE #8043D4 #7230CA #641DC0 #560AB6

#AB7DF3 - #560AB6

HSV Blend

#AB7DF3 - #560AB6 | 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 #AB7DF3 as 0% and #560AB6 as 100%.

0.0%	0.0% #AB7DF3	RGB 171 125 243	#AB7DF3
16.7%	16.7% #9A65E8	RGB 154 101 232	#9A65E8
33.3%	33.3% #8A50DE	RGB 138 80 222	#8A50DE
50.0%	50.0% #7B3CD4	RGB 123 60 212	#7B3CD4
66.7%	66.7% #6E2ACA	RGB 110 42 202	#6E2ACA
83.3%	83.3% #6119C0	RGB 97 25 192	#6119C0
100.0%	100.0% #560AB6	RGB 86 10 182	#560AB6

#AB7DF3 #9A65E8 #8A50DE #7B3CD4 #6E2ACA #6119C0 #560AB6

#AB7DF3 - #7B3CD4 - #560AB6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AB7DF3 0%, #7B3CD4 50%, #560AB6 100%);
    background: -webkit-linear-gradient(top, #AB7DF3 0%, #7B3CD4 50%, #560AB6 100%);
    background: linear-gradient(to bottom, #AB7DF3 0%, #7B3CD4 50%, #560AB6 100%);
}
</style>