#5E76A2 - #D1D7E4 | 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 #5E76A2 to #D1D7E4

#5E76A2 #D1D7E4

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

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

0.0%	0.0% #5E76A2	RGB 94 118 162	#5E76A2
16.7%	16.7% #7186AD	RGB 113 134 173	#7186AD
33.3%	33.3% #8496B8	RGB 132 150 184	#8496B8
50.0%	50.0% #97A6C3	RGB 151 166 195	#97A6C3
66.7%	66.7% #AAB6CE	RGB 170 182 206	#AAB6CE
83.3%	83.3% #BDC6D9	RGB 189 198 217	#BDC6D9
100.0%	100.0% #D1D7E4	RGB 209 215 228	#D1D7E4

#5E76A2 #7186AD #8496B8 #97A6C3 #AAB6CE #BDC6D9 #D1D7E4

#5E76A2 - #D1D7E4

HSV Blend

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

0.0%	0.0% #5E76A2	RGB 94 118 162	#5E76A2
16.7%	16.7% #6E83AD	RGB 110 131 173	#6E83AD
33.3%	33.3% #7F92B8	RGB 127 146 184	#7F92B8
50.0%	50.0% #91A2C3	RGB 145 162 195	#91A2C3
66.7%	66.7% #A5B2CE	RGB 165 178 206	#A5B2CE
83.3%	83.3% #BAC4D9	RGB 186 196 217	#BAC4D9
100.0%	100.0% #D1D7E4	RGB 209 215 228	#D1D7E4

#5E76A2 #6E83AD #7F92B8 #91A2C3 #A5B2CE #BAC4D9 #D1D7E4

#5E76A2 - #91A2C3 - #D1D7E4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E76A2 0%, #91A2C3 50%, #D1D7E4 100%);
    background: -webkit-linear-gradient(top, #5E76A2 0%, #91A2C3 50%, #D1D7E4 100%);
    background: linear-gradient(to bottom, #5E76A2 0%, #91A2C3 50%, #D1D7E4 100%);
}
</style>