#5E9FAC - #D1E3E7 | 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 #5E9FAC to #D1E3E7

#5E9FAC #D1E3E7

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

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

0.0%	0.0% #5E9FAC	RGB 94 159 172	#5E9FAC
16.7%	16.7% #71AAB5	RGB 113 170 181	#71AAB5
33.3%	33.3% #84B5BF	RGB 132 181 191	#84B5BF
50.0%	50.0% #97C1C9	RGB 151 193 201	#97C1C9
66.7%	66.7% #AACCD3	RGB 170 204 211	#AACCD3
83.3%	83.3% #BDD7DD	RGB 189 215 221	#BDD7DD
100.0%	100.0% #D1E3E7	RGB 209 227 231	#D1E3E7

#5E9FAC #71AAB5 #84B5BF #97C1C9 #AACCD3 #BDD7DD #D1E3E7

#5E9FAC - #D1E3E7

HSV Blend

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

0.0%	0.0% #5E9FAC	RGB 94 159 172	#5E9FAC
16.7%	16.7% #6EA9B5	RGB 110 169 181	#6EA9B5
33.3%	33.3% #7FB4BF	RGB 127 180 191	#7FB4BF
50.0%	50.0% #92BFC9	RGB 146 191 201	#92BFC9
66.7%	66.7% #A5CBD3	RGB 165 203 211	#A5CBD3
83.3%	83.3% #BAD7DD	RGB 186 215 221	#BAD7DD
100.0%	100.0% #D1E3E7	RGB 209 227 231	#D1E3E7

#5E9FAC #6EA9B5 #7FB4BF #92BFC9 #A5CBD3 #BAD7DD #D1E3E7

#5E9FAC - #92BFC9 - #D1E3E7

CSS codes

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

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