#4570B2 - #ACE2B9 | 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 #4570B2 to #ACE2B9

#4570B2 #ACE2B9

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

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

0.0%	0.0% #4570B2	RGB 69 112 178	#4570B2
16.7%	16.7% #5683B3	RGB 86 131 179	#5683B3
33.3%	33.3% #6796B4	RGB 103 150 180	#6796B4
50.0%	50.0% #78A9B5	RGB 120 169 181	#78A9B5
66.7%	66.7% #89BCB6	RGB 137 188 182	#89BCB6
83.3%	83.3% #9ACFB7	RGB 154 207 183	#9ACFB7
100.0%	100.0% #ACE2B9	RGB 172 226 185	#ACE2B9

#4570B2 #5683B3 #6796B4 #78A9B5 #89BCB6 #9ACFB7 #ACE2B9

#4570B2 - #ACE2B9

HSV Blend

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

0.0%	0.0% #4570B2	RGB 69 112 178	#4570B2
16.7%	16.7% #5393BA	RGB 83 147 186	#5393BA
33.3%	33.3% #63B3C2	RGB 99 179 194	#63B3C2
50.0%	50.0% #74CAC3	RGB 116 202 195	#74CAC3
66.7%	66.7% #85D2BA	RGB 133 210 186	#85D2BA
83.3%	83.3% #98DAB7	RGB 152 218 183	#98DAB7
100.0%	100.0% #ACE2B9	RGB 172 226 185	#ACE2B9

#4570B2 #5393BA #63B3C2 #74CAC3 #85D2BA #98DAB7 #ACE2B9

#4570B2 - #74CAC3 - #ACE2B9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4570B2 0%, #74CAC3 50%, #ACE2B9 100%);
    background: -webkit-linear-gradient(top, #4570B2 0%, #74CAC3 50%, #ACE2B9 100%);
    background: linear-gradient(to bottom, #4570B2 0%, #74CAC3 50%, #ACE2B9 100%);
}
</style>