#5E83A2 - #D1DAE4 | 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 #5E83A2 to #D1DAE4

#5E83A2 #D1DAE4

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

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

0.0%	0.0% #5E83A2	RGB 94 131 162	#5E83A2
16.7%	16.7% #7191AD	RGB 113 145 173	#7191AD
33.3%	33.3% #84A0B8	RGB 132 160 184	#84A0B8
50.0%	50.0% #97AEC3	RGB 151 174 195	#97AEC3
66.7%	66.7% #AABDCE	RGB 170 189 206	#AABDCE
83.3%	83.3% #BDCBD9	RGB 189 203 217	#BDCBD9
100.0%	100.0% #D1DAE4	RGB 209 218 228	#D1DAE4

#5E83A2 #7191AD #84A0B8 #97AEC3 #AABDCE #BDCBD9 #D1DAE4

#5E83A2 - #D1DAE4

HSV Blend

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

0.0%	0.0% #5E83A2	RGB 94 131 162	#5E83A2
16.7%	16.7% #6E8FAD	RGB 110 143 173	#6E8FAD
33.3%	33.3% #7F9CB8	RGB 127 156 184	#7F9CB8
50.0%	50.0% #91AAC3	RGB 145 170 195	#91AAC3
66.7%	66.7% #A5B9CE	RGB 165 185 206	#A5B9CE
83.3%	83.3% #BAC9D9	RGB 186 201 217	#BAC9D9
100.0%	100.0% #D1DAE4	RGB 209 218 228	#D1DAE4

#5E83A2 #6E8FAD #7F9CB8 #91AAC3 #A5B9CE #BAC9D9 #D1DAE4

#5E83A2 - #91AAC3 - #D1DAE4

CSS codes

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

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