#5E7DBD - #D1D8EC | 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 #5E7DBD to #D1D8EC

#5E7DBD #D1D8EC

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

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

0.0%	0.0% #5E7DBD	RGB 94 125 189	#5E7DBD
16.7%	16.7% #718CC4	RGB 113 140 196	#718CC4
33.3%	33.3% #849BCC	RGB 132 155 204	#849BCC
50.0%	50.0% #97AAD4	RGB 151 170 212	#97AAD4
66.7%	66.7% #AAB9DC	RGB 170 185 220	#AAB9DC
83.3%	83.3% #BDC8E4	RGB 189 200 228	#BDC8E4
100.0%	100.0% #D1D8EC	RGB 209 216 236	#D1D8EC

#5E7DBD #718CC4 #849BCC #97AAD4 #AAB9DC #BDC8E4 #D1D8EC

#5E7DBD - #D1D8EC

HSV Blend

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

0.0%	0.0% #5E7DBD	RGB 94 125 189	#5E7DBD
16.7%	16.7% #6E89C4	RGB 110 137 196	#6E89C4
33.3%	33.3% #8097CC	RGB 128 151 204	#8097CC
50.0%	50.0% #92A6D4	RGB 146 166 212	#92A6D4
66.7%	66.7% #A6B5DC	RGB 166 181 220	#A6B5DC
83.3%	83.3% #BBC6E4	RGB 187 198 228	#BBC6E4
100.0%	100.0% #D1D8EC	RGB 209 216 236	#D1D8EC

#5E7DBD #6E89C4 #8097CC #92A6D4 #A6B5DC #BBC6E4 #D1D8EC

#5E7DBD - #92A6D4 - #D1D8EC

CSS codes

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

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