#A8AFE3 - #475CA9 | 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 #A8AFE3 to #475CA9

#A8AFE3 #475CA9

Calculate the color between two colors, #A8AFE3 and #475CA9. 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)

#A8AFE3 - #475CA9 | 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 #A8AFE3 as 0% and #475CA9 as 100%.

0.0%	0.0% #A8AFE3	RGB 168 175 227	#A8AFE3
16.7%	16.7% #97A1D9	RGB 151 161 217	#97A1D9
33.3%	33.3% #8793CF	RGB 135 147 207	#8793CF
50.0%	50.0% #7785C6	RGB 119 133 198	#7785C6
66.7%	66.7% #6777BC	RGB 103 119 188	#6777BC
83.3%	83.3% #5769B2	RGB 87 105 178	#5769B2
100.0%	100.0% #475CA9	RGB 71 92 169	#475CA9

#A8AFE3 #97A1D9 #8793CF #7785C6 #6777BC #5769B2 #475CA9

#A8AFE3 - #475CA9

HSV Blend

#A8AFE3 - #475CA9 | 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 #A8AFE3 as 0% and #475CA9 as 100%.

0.0%	0.0% #A8AFE3	RGB 168 175 227	#A8AFE3
16.7%	16.7% #959ED9	RGB 149 158 217	#959ED9
33.3%	33.3% #838FCF	RGB 131 143 207	#838FCF
50.0%	50.0% #7280C6	RGB 114 128 198	#7280C6
66.7%	66.7% #6373BC	RGB 99 115 188	#6373BC
83.3%	83.3% #5467B2	RGB 84 103 178	#5467B2
100.0%	100.0% #475CA9	RGB 71 92 169	#475CA9

#A8AFE3 #959ED9 #838FCF #7280C6 #6373BC #5467B2 #475CA9

#A8AFE3 - #7280C6 - #475CA9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8AFE3 0%, #7280C6 50%, #475CA9 100%);
    background: -webkit-linear-gradient(top, #A8AFE3 0%, #7280C6 50%, #475CA9 100%);
    background: linear-gradient(to bottom, #A8AFE3 0%, #7280C6 50%, #475CA9 100%);
}
</style>