#ABC7E5 - #5078AF | 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 #ABC7E5 to #5078AF

#ABC7E5 #5078AF

Calculate the color between two colors, #ABC7E5 and #5078AF. 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)

#ABC7E5 - #5078AF | 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 #ABC7E5 as 0% and #5078AF as 100%.

0.0%	0.0% #ABC7E5	RGB 171 199 229	#ABC7E5
16.7%	16.7% #9BB9DC	RGB 155 185 220	#9BB9DC
33.3%	33.3% #8CACD3	RGB 140 172 211	#8CACD3
50.0%	50.0% #7D9FCA	RGB 125 159 202	#7D9FCA
66.7%	66.7% #6E92C1	RGB 110 146 193	#6E92C1
83.3%	83.3% #5F85B8	RGB 95 133 184	#5F85B8
100.0%	100.0% #5078AF	RGB 80 120 175	#5078AF

#ABC7E5 #9BB9DC #8CACD3 #7D9FCA #6E92C1 #5F85B8 #5078AF

#ABC7E5 - #5078AF

HSV Blend

#ABC7E5 - #5078AF | 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 #ABC7E5 as 0% and #5078AF as 100%.

0.0%	0.0% #ABC7E5	RGB 171 199 229	#ABC7E5
16.7%	16.7% #99B9DC	RGB 153 185 220	#99B9DC
33.3%	33.3% #89ABD3	RGB 137 171 211	#89ABD3
50.0%	50.0% #799DCA	RGB 121 157 202	#799DCA
66.7%	66.7% #6A90C1	RGB 106 144 193	#6A90C1
83.3%	83.3% #5C84B8	RGB 92 132 184	#5C84B8
100.0%	100.0% #5078AF	RGB 80 120 175	#5078AF

#ABC7E5 #99B9DC #89ABD3 #799DCA #6A90C1 #5C84B8 #5078AF

#ABC7E5 - #799DCA - #5078AF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ABC7E5 0%, #799DCA 50%, #5078AF 100%);
    background: -webkit-linear-gradient(top, #ABC7E5 0%, #799DCA 50%, #5078AF 100%);
    background: linear-gradient(to bottom, #ABC7E5 0%, #799DCA 50%, #5078AF 100%);
}
</style>