#5E9AFF - #A1D2F6 | 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 #5E9AFF to #A1D2F6

#5E9AFF #A1D2F6

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

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

0.0%	0.0% #5E9AFF	RGB 94 154 255	#5E9AFF
16.7%	16.7% #69A3FD	RGB 105 163 253	#69A3FD
33.3%	33.3% #74ACFC	RGB 116 172 252	#74ACFC
50.0%	50.0% #7FB6FA	RGB 127 182 250	#7FB6FA
66.7%	66.7% #8ABFF9	RGB 138 191 249	#8ABFF9
83.3%	83.3% #95C8F7	RGB 149 200 247	#95C8F7
100.0%	100.0% #A1D2F6	RGB 161 210 246	#A1D2F6

#5E9AFF #69A3FD #74ACFC #7FB6FA #8ABFF9 #95C8F7 #A1D2F6

#5E9AFF - #A1D2F6

HSV Blend

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

0.0%	0.0% #5D9AFF	RGB 93 154 255	#5D9AFF
16.7%	16.7% #69A5FD	RGB 105 165 253	#69A5FD
33.3%	33.3% #74B0FC	RGB 116 176 252	#74B0FC
50.0%	50.0% #80BAFA	RGB 128 186 250	#80BAFA
66.7%	66.7% #8BC3F9	RGB 139 195 249	#8BC3F9
83.3%	83.3% #96CAF7	RGB 150 202 247	#96CAF7
100.0%	100.0% #A1D2F6	RGB 161 210 246	#A1D2F6

#5D9AFF #69A5FD #74B0FC #80BAFA #8BC3F9 #96CAF7 #A1D2F6

#5E9AFF - #80BAFA - #A1D2F6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5D9AFF 0%, #80BAFA 50%, #A1D2F6 100%);
    background: -webkit-linear-gradient(top, #5D9AFF 0%, #80BAFA 50%, #A1D2F6 100%);
    background: linear-gradient(to bottom, #5D9AFF 0%, #80BAFA 50%, #A1D2F6 100%);
}
</style>