#5E76D1 - #D1D7F1 | 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 #5E76D1 to #D1D7F1

#5E76D1 #D1D7F1

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

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

0.0%	0.0% #5E76D1	RGB 94 118 209	#5E76D1
16.7%	16.7% #7186D6	RGB 113 134 214	#7186D6
33.3%	33.3% #8496DB	RGB 132 150 219	#8496DB
50.0%	50.0% #97A6E1	RGB 151 166 225	#97A6E1
66.7%	66.7% #AAB6E6	RGB 170 182 230	#AAB6E6
83.3%	83.3% #BDC6EB	RGB 189 198 235	#BDC6EB
100.0%	100.0% #D1D7F1	RGB 209 215 241	#D1D7F1

#5E76D1 #7186D6 #8496DB #97A6E1 #AAB6E6 #BDC6EB #D1D7F1

#5E76D1 - #D1D7F1

HSV Blend

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

0.0%	0.0% #5E76D1	RGB 94 118 209	#5E76D1
16.7%	16.7% #6F84D6	RGB 111 132 214	#6F84D6
33.3%	33.3% #8193DB	RGB 129 147 219	#8193DB
50.0%	50.0% #94A3E1	RGB 148 163 225	#94A3E1
66.7%	66.7% #A7B3E6	RGB 167 179 230	#A7B3E6
83.3%	83.3% #BBC5EB	RGB 187 197 235	#BBC5EB
100.0%	100.0% #D1D7F1	RGB 209 215 241	#D1D7F1

#5E76D1 #6F84D6 #8193DB #94A3E1 #A7B3E6 #BBC5EB #D1D7F1

#5E76D1 - #94A3E1 - #D1D7F1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E76D1 0%, #94A3E1 50%, #D1D7F1 100%);
    background: -webkit-linear-gradient(top, #5E76D1 0%, #94A3E1 50%, #D1D7F1 100%);
    background: linear-gradient(to bottom, #5E76D1 0%, #94A3E1 50%, #D1D7F1 100%);
}
</style>