#5E86B4 - #BDC5C9 | 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 #5E86B4 to #BDC5C9

#5E86B4 #BDC5C9

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

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

0.0%	0.0% #5E86B4	RGB 94 134 180	#5E86B4
16.7%	16.7% #6D90B7	RGB 109 144 183	#6D90B7
33.3%	33.3% #7D9BBB	RGB 125 155 187	#7D9BBB
50.0%	50.0% #8DA5BE	RGB 141 165 190	#8DA5BE
66.7%	66.7% #9DB0C2	RGB 157 176 194	#9DB0C2
83.3%	83.3% #ADBAC5	RGB 173 186 197	#ADBAC5
100.0%	100.0% #BDC5C9	RGB 189 197 201	#BDC5C9

#5E86B4 #6D90B7 #7D9BBB #8DA5BE #9DB0C2 #ADBAC5 #BDC5C9

#5E86B4 - #BDC5C9

HSV Blend

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

0.0%	0.0% #5E86B4	RGB 94 134 180	#5E86B4
16.7%	16.7% #6C91B7	RGB 108 145 183	#6C91B7
33.3%	33.3% #7B9DBB	RGB 123 157 187	#7B9DBB
50.0%	50.0% #8BA8BE	RGB 139 168 190	#8BA8BE
66.7%	66.7% #9BB2C2	RGB 155 178 194	#9BB2C2
83.3%	83.3% #ABBCC5	RGB 171 188 197	#ABBCC5
100.0%	100.0% #BDC5C9	RGB 189 197 201	#BDC5C9

#5E86B4 #6C91B7 #7B9DBB #8BA8BE #9BB2C2 #ABBCC5 #BDC5C9

#5E86B4 - #8BA8BE - #BDC5C9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E86B4 0%, #8BA8BE 50%, #BDC5C9 100%);
    background: -webkit-linear-gradient(top, #5E86B4 0%, #8BA8BE 50%, #BDC5C9 100%);
    background: linear-gradient(to bottom, #5E86B4 0%, #8BA8BE 50%, #BDC5C9 100%);
}
</style>