#A8DAFF - #488FD9 | 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 #A8DAFF to #488FD9

#A8DAFF #488FD9

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

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

0.0%	0.0% #A8DAFF	RGB 168 218 255	#A8DAFF
16.7%	16.7% #98CDF8	RGB 152 205 248	#98CDF8
33.3%	33.3% #88C1F2	RGB 136 193 242	#88C1F2
50.0%	50.0% #78B4EC	RGB 120 180 236	#78B4EC
66.7%	66.7% #68A8E5	RGB 104 168 229	#68A8E5
83.3%	83.3% #589BDF	RGB 88 155 223	#589BDF
100.0%	100.0% #488FD9	RGB 72 143 217	#488FD9

#A8DAFF #98CDF8 #88C1F2 #78B4EC #68A8E5 #589BDF #488FD9

#A8DAFF - #488FD9

HSV Blend

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

0.0%	0.0% #A8DAFF	RGB 168 218 255	#A8DAFF
16.7%	16.7% #96CDF8	RGB 150 205 248	#96CDF8
33.3%	33.3% #85C0F2	RGB 133 192 242	#85C0F2
50.0%	50.0% #74B4EC	RGB 116 180 236	#74B4EC
66.7%	66.7% #65A7E5	RGB 101 167 229	#65A7E5
83.3%	83.3% #569BDF	RGB 86 155 223	#569BDF
100.0%	100.0% #488FD9	RGB 72 143 217	#488FD9

#A8DAFF #96CDF8 #85C0F2 #74B4EC #65A7E5 #569BDF #488FD9

#A8DAFF - #74B4EC - #488FD9

CSS codes

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

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