#ACB2FF - #4458D3 | 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 #ACB2FF to #4458D3

#ACB2FF #4458D3

Calculate the color between two colors, #ACB2FF and #4458D3. 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)

#ACB2FF - #4458D3 | 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 #ACB2FF as 0% and #4458D3 as 100%.

0.0%	0.0% #ACB2FF	RGB 172 178 255	#ACB2FF
16.7%	16.7% #9AA3F7	RGB 154 163 247	#9AA3F7
33.3%	33.3% #8994F0	RGB 137 148 240	#8994F0
50.0%	50.0% #7885E9	RGB 120 133 233	#7885E9
66.7%	66.7% #6676E1	RGB 102 118 225	#6676E1
83.3%	83.3% #5567DA	RGB 85 103 218	#5567DA
100.0%	100.0% #4458D3	RGB 68 88 211	#4458D3

#ACB2FF #9AA3F7 #8994F0 #7885E9 #6676E1 #5567DA #4458D3

#ACB2FF - #4458D3

HSV Blend

#ACB2FF - #4458D3 | 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 #ACB2FF as 0% and #4458D3 as 100%.

0.0%	0.0% #ACB1FF	RGB 172 177 255	#ACB1FF
16.7%	16.7% #98A0F7	RGB 152 160 247	#98A0F7
33.3%	33.3% #858FF0	RGB 133 143 240	#858FF0
50.0%	50.0% #7480E9	RGB 116 128 233	#7480E9
66.7%	66.7% #6372E1	RGB 99 114 225	#6372E1
83.3%	83.3% #5364DA	RGB 83 100 218	#5364DA
100.0%	100.0% #4458D3	RGB 68 88 211	#4458D3

#ACB1FF #98A0F7 #858FF0 #7480E9 #6372E1 #5364DA #4458D3

#ACB2FF - #7480E9 - #4458D3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ACB1FF 0%, #7480E9 50%, #4458D3 100%);
    background: -webkit-linear-gradient(top, #ACB1FF 0%, #7480E9 50%, #4458D3 100%);
    background: linear-gradient(to bottom, #ACB1FF 0%, #7480E9 50%, #4458D3 100%);
}
</style>