#A8C1F7 - #476EC9 | 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 #476EC9

#A8C1F7 #476EC9

Calculate the color between two colors, #A8C1F7 and #476EC9. 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 - #476EC9 | 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 #476EC9 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% #476EC9	RGB 71 110 201	#476EC9

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

#A8C1F7 - #476EC9

HSV Blend

#A8C1F7 - #476EC9 | 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 #476EC9 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% #84A3E7	RGB 132 163 231	#84A3E7
50.0%	50.0% #7395E0	RGB 115 149 224	#7395E0
66.7%	66.7% #6387D8	RGB 99 135 216	#6387D8
83.3%	83.3% #557AD0	RGB 85 122 208	#557AD0
100.0%	100.0% #476EC9	RGB 71 110 201	#476EC9

#A8C1F7 #95B1EF #84A3E7 #7395E0 #6387D8 #557AD0 #476EC9

#A8C1F7 - #7395E0 - #476EC9

CSS codes

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

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