#5E80D6 - #A6C2E3 | 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 #5E80D6 to #A6C2E3

#5E80D6 #A6C2E3

Calculate the color between two colors, #5E80D6 and #A6C2E3. 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)

#5E80D6 - #A6C2E3 | 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 #5E80D6 as 0% and #A6C2E3 as 100%.

0.0%	0.0% #5E80D6	RGB 94 128 214	#5E80D6
16.7%	16.7% #6A8BD8	RGB 106 139 216	#6A8BD8
33.3%	33.3% #7696DA	RGB 118 150 218	#7696DA
50.0%	50.0% #82A1DC	RGB 130 161 220	#82A1DC
66.7%	66.7% #8EACDE	RGB 142 172 222	#8EACDE
83.3%	83.3% #9AB7E0	RGB 154 183 224	#9AB7E0
100.0%	100.0% #A6C2E3	RGB 166 194 227	#A6C2E3

#5E80D6 #6A8BD8 #7696DA #82A1DC #8EACDE #9AB7E0 #A6C2E3

#5E80D6 - #A6C2E3

HSV Blend

#5E80D6 - #A6C2E3 | 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 #5E80D6 as 0% and #A6C2E3 as 100%.

0.0%	0.0% #5E80D6	RGB 94 128 214	#5E80D6
16.7%	16.7% #698CD8	RGB 105 140 216	#698CD8
33.3%	33.3% #7597DA	RGB 117 151 218	#7597DA
50.0%	50.0% #81A2DC	RGB 129 162 220	#81A2DC
66.7%	66.7% #8DADDE	RGB 141 173 222	#8DADDE
83.3%	83.3% #99B8E0	RGB 153 184 224	#99B8E0
100.0%	100.0% #A6C2E3	RGB 166 194 227	#A6C2E3

#5E80D6 #698CD8 #7597DA #81A2DC #8DADDE #99B8E0 #A6C2E3

#5E80D6 - #81A2DC - #A6C2E3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E80D6 0%, #81A2DC 50%, #A6C2E3 100%);
    background: -webkit-linear-gradient(top, #5E80D6 0%, #81A2DC 50%, #A6C2E3 100%);
    background: linear-gradient(to bottom, #5E80D6 0%, #81A2DC 50%, #A6C2E3 100%);
}
</style>