#5E80B8 - #D1DAEA | 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 #5E80B8 to #D1DAEA

#5E80B8 #D1DAEA

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

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

0.0%	0.0% #5E80B8	RGB 94 128 184	#5E80B8
16.7%	16.7% #718FC0	RGB 113 143 192	#718FC0
33.3%	33.3% #849EC8	RGB 132 158 200	#849EC8
50.0%	50.0% #97ADD1	RGB 151 173 209	#97ADD1
66.7%	66.7% #AABCD9	RGB 170 188 217	#AABCD9
83.3%	83.3% #BDCBE1	RGB 189 203 225	#BDCBE1
100.0%	100.0% #D1DAEA	RGB 209 218 234	#D1DAEA

#5E80B8 #718FC0 #849EC8 #97ADD1 #AABCD9 #BDCBE1 #D1DAEA

#5E80B8 - #D1DAEA

HSV Blend

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

0.0%	0.0% #5E80B8	RGB 94 128 184	#5E80B8
16.7%	16.7% #6E8DC0	RGB 110 141 192	#6E8DC0
33.3%	33.3% #809BC8	RGB 128 155 200	#809BC8
50.0%	50.0% #92A9D1	RGB 146 169 209	#92A9D1
66.7%	66.7% #A6B9D9	RGB 166 185 217	#A6B9D9
83.3%	83.3% #BBC9E1	RGB 187 201 225	#BBC9E1
100.0%	100.0% #D1DAEA	RGB 209 218 234	#D1DAEA

#5E80B8 #6E8DC0 #809BC8 #92A9D1 #A6B9D9 #BBC9E1 #D1DAEA

#5E80B8 - #92A9D1 - #D1DAEA

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E80B8 0%, #92A9D1 50%, #D1DAEA 100%);
    background: -webkit-linear-gradient(top, #5E80B8 0%, #92A9D1 50%, #D1DAEA 100%);
    background: linear-gradient(to bottom, #5E80B8 0%, #92A9D1 50%, #D1DAEA 100%);
}
</style>