#ABC5E4 - #5075AD | 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 #ABC5E4 to #5075AD

#ABC5E4 #5075AD

Calculate the color between two colors, #ABC5E4 and #5075AD. 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)

#ABC5E4 - #5075AD | 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 #ABC5E4 as 0% and #5075AD as 100%.

0.0%	0.0% #ABC5E4	RGB 171 197 228	#ABC5E4
16.7%	16.7% #9BB7DA	RGB 155 183 218	#9BB7DA
33.3%	33.3% #8CAAD1	RGB 140 170 209	#8CAAD1
50.0%	50.0% #7D9DC8	RGB 125 157 200	#7D9DC8
66.7%	66.7% #6E8FBF	RGB 110 143 191	#6E8FBF
83.3%	83.3% #5F82B6	RGB 95 130 182	#5F82B6
100.0%	100.0% #5075AD	RGB 80 117 173	#5075AD

#ABC5E4 #9BB7DA #8CAAD1 #7D9DC8 #6E8FBF #5F82B6 #5075AD

#ABC5E4 - #5075AD

HSV Blend

#ABC5E4 - #5075AD | 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 #ABC5E4 as 0% and #5075AD as 100%.

0.0%	0.0% #ABC5E4	RGB 171 197 228	#ABC5E4
16.7%	16.7% #99B6DA	RGB 153 182 218	#99B6DA
33.3%	33.3% #89A8D1	RGB 137 168 209	#89A8D1
50.0%	50.0% #799BC8	RGB 121 155 200	#799BC8
66.7%	66.7% #6A8EBF	RGB 106 142 191	#6A8EBF
83.3%	83.3% #5C81B6	RGB 92 129 182	#5C81B6
100.0%	100.0% #5075AD	RGB 80 117 173	#5075AD

#ABC5E4 #99B6DA #89A8D1 #799BC8 #6A8EBF #5C81B6 #5075AD

#ABC5E4 - #799BC8 - #5075AD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ABC5E4 0%, #799BC8 50%, #5075AD 100%);
    background: -webkit-linear-gradient(top, #ABC5E4 0%, #799BC8 50%, #5075AD 100%);
    background: linear-gradient(to bottom, #ABC5E4 0%, #799BC8 50%, #5075AD 100%);
}
</style>