#5E81A2 - #D1DBE4 | 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 #5E81A2 to #D1DBE4

#5E81A2 #D1DBE4

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

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

0.0%	0.0% #5E81A2	RGB 94 129 162	#5E81A2
16.7%	16.7% #7190AD	RGB 113 144 173	#7190AD
33.3%	33.3% #849FB8	RGB 132 159 184	#849FB8
50.0%	50.0% #97AEC3	RGB 151 174 195	#97AEC3
66.7%	66.7% #AABDCE	RGB 170 189 206	#AABDCE
83.3%	83.3% #BDCCD9	RGB 189 204 217	#BDCCD9
100.0%	100.0% #D1DBE4	RGB 209 219 228	#D1DBE4

#5E81A2 #7190AD #849FB8 #97AEC3 #AABDCE #BDCCD9 #D1DBE4

#5E81A2 - #D1DBE4

HSV Blend

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

0.0%	0.0% #5E80A2	RGB 94 128 162	#5E80A2
16.7%	16.7% #6E8EAD	RGB 110 142 173	#6E8EAD
33.3%	33.3% #7F9CB8	RGB 127 156 184	#7F9CB8
50.0%	50.0% #91ABC3	RGB 145 171 195	#91ABC3
66.7%	66.7% #A5BACE	RGB 165 186 206	#A5BACE
83.3%	83.3% #BACAD9	RGB 186 202 217	#BACAD9
100.0%	100.0% #D1DBE4	RGB 209 219 228	#D1DBE4

#5E80A2 #6E8EAD #7F9CB8 #91ABC3 #A5BACE #BACAD9 #D1DBE4

#5E81A2 - #91ABC3 - #D1DBE4

CSS codes

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

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