#ACACEA - #4757B2 | 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 #ACACEA to #4757B2

#ACACEA #4757B2

Calculate the color between two colors, #ACACEA and #4757B2. 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)

#ACACEA - #4757B2 | 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 #ACACEA as 0% and #4757B2 as 100%.

0.0%	0.0% #ACACEA	RGB 172 172 234	#ACACEA
16.7%	16.7% #9B9DE0	RGB 155 157 224	#9B9DE0
33.3%	33.3% #8A8FD7	RGB 138 143 215	#8A8FD7
50.0%	50.0% #7981CE	RGB 121 129 206	#7981CE
66.7%	66.7% #6873C4	RGB 104 115 196	#6873C4
83.3%	83.3% #5765BB	RGB 87 101 187	#5765BB
100.0%	100.0% #4757B2	RGB 71 87 178	#4757B2

#ACACEA #9B9DE0 #8A8FD7 #7981CE #6873C4 #5765BB #4757B2

#ACACEA - #4757B2

HSV Blend

#ACACEA - #4757B2 | 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 #ACACEA as 0% and #4757B2 as 100%.

0.0%	0.0% #ACACEA	RGB 172 172 234	#ACACEA
16.7%	16.7% #989AE0	RGB 152 154 224	#989AE0
33.3%	33.3% #868AD7	RGB 134 138 215	#868AD7
50.0%	50.0% #747BCE	RGB 116 123 206	#747BCE
66.7%	66.7% #646EC4	RGB 100 110 196	#646EC4
83.3%	83.3% #5561BB	RGB 85 97 187	#5561BB
100.0%	100.0% #4757B2	RGB 71 87 178	#4757B2

#ACACEA #989AE0 #868AD7 #747BCE #646EC4 #5561BB #4757B2

#ACACEA - #747BCE - #4757B2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ACACEA 0%, #747BCE 50%, #4757B2 100%);
    background: -webkit-linear-gradient(top, #ACACEA 0%, #747BCE 50%, #4757B2 100%);
    background: linear-gradient(to bottom, #ACACEA 0%, #747BCE 50%, #4757B2 100%);
}
</style>