#A8C1F7 - #476DC9 | 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 #A8C1F7 to #476DC9

#A8C1F7 #476DC9

Calculate the color between two colors, #A8C1F7 and #476DC9. 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)

#A8C1F7 - #476DC9 | 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 #A8C1F7 as 0% and #476DC9 as 100%.

0.0%	0.0% #A8C1F7	RGB 168 193 247	#A8C1F7
16.7%	16.7% #97B3EF	RGB 151 179 239	#97B3EF
33.3%	33.3% #87A5E7	RGB 135 165 231	#87A5E7
50.0%	50.0% #7797E0	RGB 119 151 224	#7797E0
66.7%	66.7% #6789D8	RGB 103 137 216	#6789D8
83.3%	83.3% #577BD0	RGB 87 123 208	#577BD0
100.0%	100.0% #476DC9	RGB 71 109 201	#476DC9

#A8C1F7 #97B3EF #87A5E7 #7797E0 #6789D8 #577BD0 #476DC9

#A8C1F7 - #476DC9

HSV Blend

#A8C1F7 - #476DC9 | 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 #A8C1F7 as 0% and #476DC9 as 100%.

0.0%	0.0% #A8C1F7	RGB 168 193 247	#A8C1F7
16.7%	16.7% #95B1EF	RGB 149 177 239	#95B1EF
33.3%	33.3% #84A2E7	RGB 132 162 231	#84A2E7
50.0%	50.0% #7394E0	RGB 115 148 224	#7394E0
66.7%	66.7% #6386D8	RGB 99 134 216	#6386D8
83.3%	83.3% #5579D0	RGB 85 121 208	#5579D0
100.0%	100.0% #476DC9	RGB 71 109 201	#476DC9

#A8C1F7 #95B1EF #84A2E7 #7394E0 #6386D8 #5579D0 #476DC9

#A8C1F7 - #7394E0 - #476DC9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8C1F7 0%, #7394E0 50%, #476DC9 100%);
    background: -webkit-linear-gradient(top, #A8C1F7 0%, #7394E0 50%, #476DC9 100%);
    background: linear-gradient(to bottom, #A8C1F7 0%, #7394E0 50%, #476DC9 100%);
}
</style>