#5E84C4 - #D1DBEE | 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 #5E84C4 to #D1DBEE

#5E84C4 #D1DBEE

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

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

0.0%	0.0% #5E84C4	RGB 94 132 196	#5E84C4
16.7%	16.7% #7192CB	RGB 113 146 203	#7192CB
33.3%	33.3% #84A1D2	RGB 132 161 210	#84A1D2
50.0%	50.0% #97AFD9	RGB 151 175 217	#97AFD9
66.7%	66.7% #AABEE0	RGB 170 190 224	#AABEE0
83.3%	83.3% #BDCCE7	RGB 189 204 231	#BDCCE7
100.0%	100.0% #D1DBEE	RGB 209 219 238	#D1DBEE

#5E84C4 #7192CB #84A1D2 #97AFD9 #AABEE0 #BDCCE7 #D1DBEE

#5E84C4 - #D1DBEE

HSV Blend

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

0.0%	0.0% #5E84C4	RGB 94 132 196	#5E84C4
16.7%	16.7% #6E90CB	RGB 110 144 203	#6E90CB
33.3%	33.3% #809ED2	RGB 128 158 210	#809ED2
50.0%	50.0% #93ACD9	RGB 147 172 217	#93ACD9
66.7%	66.7% #A6BBE0	RGB 166 187 224	#A6BBE0
83.3%	83.3% #BBCAE7	RGB 187 202 231	#BBCAE7
100.0%	100.0% #D1DBEE	RGB 209 219 238	#D1DBEE

#5E84C4 #6E90CB #809ED2 #93ACD9 #A6BBE0 #BBCAE7 #D1DBEE

#5E84C4 - #93ACD9 - #D1DBEE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E84C4 0%, #93ACD9 50%, #D1DBEE 100%);
    background: -webkit-linear-gradient(top, #5E84C4 0%, #93ACD9 50%, #D1DBEE 100%);
    background: linear-gradient(to bottom, #5E84C4 0%, #93ACD9 50%, #D1DBEE 100%);
}
</style>