#4170A8 - #A2B9C8 | 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 #4170A8 to #A2B9C8

#4170A8 #A2B9C8

Calculate the color between two colors, #4170A8 and #A2B9C8. 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)

#4170A8 - #A2B9C8 | 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 #4170A8 as 0% and #A2B9C8 as 100%.

0.0%	0.0% #4170A8	RGB 65 112 168	#4170A8
16.7%	16.7% #517CAD	RGB 81 124 173	#517CAD
33.3%	33.3% #6188B2	RGB 97 136 178	#6188B2
50.0%	50.0% #7194B8	RGB 113 148 184	#7194B8
66.7%	66.7% #81A0BD	RGB 129 160 189	#81A0BD
83.3%	83.3% #91ACC2	RGB 145 172 194	#91ACC2
100.0%	100.0% #A2B9C8	RGB 162 185 200	#A2B9C8

#4170A8 #517CAD #6188B2 #7194B8 #81A0BD #91ACC2 #A2B9C8

#4170A8 - #A2B9C8

HSV Blend

#4170A8 - #A2B9C8 | 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 #4170A8 as 0% and #A2B9C8 as 100%.

0.0%	0.0% #4170A8	RGB 65 112 168	#4170A8
16.7%	16.7% #4F7CAD	RGB 79 124 173	#4F7CAD
33.3%	33.3% #5E88B2	RGB 94 136 178	#5E88B2
50.0%	50.0% #6E95B8	RGB 110 149 184	#6E95B8
66.7%	66.7% #7EA1BD	RGB 126 161 189	#7EA1BD
83.3%	83.3% #8FADC2	RGB 143 173 194	#8FADC2
100.0%	100.0% #A2B9C8	RGB 162 185 200	#A2B9C8

#4170A8 #4F7CAD #5E88B2 #6E95B8 #7EA1BD #8FADC2 #A2B9C8

#4170A8 - #6E95B8 - #A2B9C8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4170A8 0%, #6E95B8 50%, #A2B9C8 100%);
    background: -webkit-linear-gradient(top, #4170A8 0%, #6E95B8 50%, #A2B9C8 100%);
    background: linear-gradient(to bottom, #4170A8 0%, #6E95B8 50%, #A2B9C8 100%);
}
</style>