#A0BCD9 - #486C9D | 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 #A0BCD9 to #486C9D

#A0BCD9 #486C9D

Calculate the color between two colors, #A0BCD9 and #486C9D. 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)

#A0BCD9 - #486C9D | 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 #A0BCD9 as 0% and #486C9D as 100%.

0.0%	0.0% #A0BCD9	RGB 160 188 217	#A0BCD9
16.7%	16.7% #91AECF	RGB 145 174 207	#91AECF
33.3%	33.3% #82A1C5	RGB 130 161 197	#82A1C5
50.0%	50.0% #7494BB	RGB 116 148 187	#7494BB
66.7%	66.7% #6586B1	RGB 101 134 177	#6586B1
83.3%	83.3% #5679A7	RGB 86 121 167	#5679A7
100.0%	100.0% #486C9D	RGB 72 108 157	#486C9D

#A0BCD9 #91AECF #82A1C5 #7494BB #6586B1 #5679A7 #486C9D

#A0BCD9 - #486C9D

HSV Blend

#A0BCD9 - #486C9D | 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 #A0BCD9 as 0% and #486C9D as 100%.

0.0%	0.0% #A0BCD9	RGB 160 188 217	#A0BCD9
16.7%	16.7% #8FADCF	RGB 143 173 207	#8FADCF
33.3%	33.3% #7E9FC5	RGB 126 159 197	#7E9FC5
50.0%	50.0% #6F92BB	RGB 111 146 187	#6F92BB
66.7%	66.7% #6185B1	RGB 97 133 177	#6185B1
83.3%	83.3% #5478A7	RGB 84 120 167	#5478A7
100.0%	100.0% #486C9D	RGB 72 108 157	#486C9D

#A0BCD9 #8FADCF #7E9FC5 #6F92BB #6185B1 #5478A7 #486C9D

#A0BCD9 - #6F92BB - #486C9D

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A0BCD9 0%, #6F92BB 50%, #486C9D 100%);
    background: -webkit-linear-gradient(top, #A0BCD9 0%, #6F92BB 50%, #486C9D 100%);
    background: linear-gradient(to bottom, #A0BCD9 0%, #6F92BB 50%, #486C9D 100%);
}
</style>