#A8D8FF - #488CD9 | 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 #A8D8FF to #488CD9

#A8D8FF #488CD9

Calculate the color between two colors, #A8D8FF and #488CD9. 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)

#A8D8FF - #488CD9 | 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 #A8D8FF as 0% and #488CD9 as 100%.

0.0%	0.0% #A8D8FF	RGB 168 216 255	#A8D8FF
16.7%	16.7% #98CBF8	RGB 152 203 248	#98CBF8
33.3%	33.3% #88BEF2	RGB 136 190 242	#88BEF2
50.0%	50.0% #78B2EC	RGB 120 178 236	#78B2EC
66.7%	66.7% #68A5E5	RGB 104 165 229	#68A5E5
83.3%	83.3% #5898DF	RGB 88 152 223	#5898DF
100.0%	100.0% #488CD9	RGB 72 140 217	#488CD9

#A8D8FF #98CBF8 #88BEF2 #78B2EC #68A5E5 #5898DF #488CD9

#A8D8FF - #488CD9

HSV Blend

#A8D8FF - #488CD9 | 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 #A8D8FF as 0% and #488CD9 as 100%.

0.0%	0.0% #A8D8FF	RGB 168 216 255	#A8D8FF
16.7%	16.7% #96CBF8	RGB 150 203 248	#96CBF8
33.3%	33.3% #85BEF2	RGB 133 190 242	#85BEF2
50.0%	50.0% #74B1EC	RGB 116 177 236	#74B1EC
66.7%	66.7% #65A5E5	RGB 101 165 229	#65A5E5
83.3%	83.3% #5698DF	RGB 86 152 223	#5698DF
100.0%	100.0% #488CD9	RGB 72 140 217	#488CD9

#A8D8FF #96CBF8 #85BEF2 #74B1EC #65A5E5 #5698DF #488CD9

#A8D8FF - #74B1EC - #488CD9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8D8FF 0%, #74B1EC 50%, #488CD9 100%);
    background: -webkit-linear-gradient(top, #A8D8FF 0%, #74B1EC 50%, #488CD9 100%);
    background: linear-gradient(to bottom, #A8D8FF 0%, #74B1EC 50%, #488CD9 100%);
}
</style>