#A2D4F9 - #E4F2FD | 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 #A2D4F9 to #E4F2FD

#A2D4F9 #E4F2FD

Calculate the color between two colors, #A2D4F9 and #E4F2FD. 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)

#A2D4F9 - #E4F2FD | 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 #A2D4F9 as 0% and #E4F2FD as 100%.

0.0%	0.0% #A2D4F9	RGB 162 212 249	#A2D4F9
16.7%	16.7% #ADD9F9	RGB 173 217 249	#ADD9F9
33.3%	33.3% #B8DEFA	RGB 184 222 250	#B8DEFA
50.0%	50.0% #C3E3FB	RGB 195 227 251	#C3E3FB
66.7%	66.7% #CEE8FB	RGB 206 232 251	#CEE8FB
83.3%	83.3% #D9EDFC	RGB 217 237 252	#D9EDFC
100.0%	100.0% #E4F2FD	RGB 228 242 253	#E4F2FD

#A2D4F9 #ADD9F9 #B8DEFA #C3E3FB #CEE8FB #D9EDFC #E4F2FD

#A2D4F9 - #E4F2FD

HSV Blend

#A2D4F9 - #E4F2FD | 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 #A2D4F9 as 0% and #E4F2FD as 100%.

0.0%	0.0% #A2D4F9	RGB 162 212 249	#A2D4F9
16.7%	16.7% #ACD8F9	RGB 172 216 249	#ACD8F9
33.3%	33.3% #B7DDFA	RGB 183 221 250	#B7DDFA
50.0%	50.0% #C2E2FB	RGB 194 226 251	#C2E2FB
66.7%	66.7% #CDE7FB	RGB 205 231 251	#CDE7FB
83.3%	83.3% #D8ECFC	RGB 216 236 252	#D8ECFC
100.0%	100.0% #E4F2FD	RGB 228 242 253	#E4F2FD

#A2D4F9 #ACD8F9 #B7DDFA #C2E2FB #CDE7FB #D8ECFC #E4F2FD

#A2D4F9 - #C2E2FB - #E4F2FD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A2D4F9 0%, #C2E2FB 50%, #E4F2FD 100%);
    background: -webkit-linear-gradient(top, #A2D4F9 0%, #C2E2FB 50%, #E4F2FD 100%);
    background: linear-gradient(to bottom, #A2D4F9 0%, #C2E2FB 50%, #E4F2FD 100%);
}
</style>