#5E86E8 - #D1DCF8 | 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 #5E86E8 to #D1DCF8

#5E86E8 #D1DCF8

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

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

0.0%	0.0% #5E86E8	RGB 94 134 232	#5E86E8
16.7%	16.7% #7194EA	RGB 113 148 234	#7194EA
33.3%	33.3% #84A2ED	RGB 132 162 237	#84A2ED
50.0%	50.0% #97B1F0	RGB 151 177 240	#97B1F0
66.7%	66.7% #AABFF2	RGB 170 191 242	#AABFF2
83.3%	83.3% #BDCDF5	RGB 189 205 245	#BDCDF5
100.0%	100.0% #D1DCF8	RGB 209 220 248	#D1DCF8

#5E86E8 #7194EA #84A2ED #97B1F0 #AABFF2 #BDCDF5 #D1DCF8

#5E86E8 - #D1DCF8

HSV Blend

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

0.0%	0.0% #5E86E8	RGB 94 134 232	#5E86E8
16.7%	16.7% #7093EA	RGB 112 147 234	#7093EA
33.3%	33.3% #82A1ED	RGB 130 161 237	#82A1ED
50.0%	50.0% #95AFF0	RGB 149 175 240	#95AFF0
66.7%	66.7% #A9BEF2	RGB 169 190 242	#A9BEF2
83.3%	83.3% #BCCCF5	RGB 188 204 245	#BCCCF5
100.0%	100.0% #D1DCF8	RGB 209 220 248	#D1DCF8

#5E86E8 #7093EA #82A1ED #95AFF0 #A9BEF2 #BCCCF5 #D1DCF8

#5E86E8 - #95AFF0 - #D1DCF8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E86E8 0%, #95AFF0 50%, #D1DCF8 100%);
    background: -webkit-linear-gradient(top, #5E86E8 0%, #95AFF0 50%, #D1DCF8 100%);
    background: linear-gradient(to bottom, #5E86E8 0%, #95AFF0 50%, #D1DCF8 100%);
}
</style>