#5E7EB1 - #B7BFC7 | 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 #5E7EB1 to #B7BFC7

#5E7EB1 #B7BFC7

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

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

0.0%	0.0% #5E7EB1	RGB 94 126 177	#5E7EB1
16.7%	16.7% #6C88B4	RGB 108 136 180	#6C88B4
33.3%	33.3% #7B93B8	RGB 123 147 184	#7B93B8
50.0%	50.0% #8A9EBC	RGB 138 158 188	#8A9EBC
66.7%	66.7% #99A9BF	RGB 153 169 191	#99A9BF
83.3%	83.3% #A8B4C3	RGB 168 180 195	#A8B4C3
100.0%	100.0% #B7BFC7	RGB 183 191 199	#B7BFC7

#5E7EB1 #6C88B4 #7B93B8 #8A9EBC #99A9BF #A8B4C3 #B7BFC7

#5E7EB1 - #B7BFC7

HSV Blend

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

0.0%	0.0% #5E7EB1	RGB 94 126 177	#5E7EB1
16.7%	16.7% #6B89B4	RGB 107 137 180	#6B89B4
33.3%	33.3% #7994B8	RGB 121 148 184	#7994B8
50.0%	50.0% #889FBC	RGB 136 159 188	#889FBC
66.7%	66.7% #97AABF	RGB 151 170 191	#97AABF
83.3%	83.3% #A6B4C3	RGB 166 180 195	#A6B4C3
100.0%	100.0% #B7BFC7	RGB 183 191 199	#B7BFC7

#5E7EB1 #6B89B4 #7994B8 #889FBC #97AABF #A6B4C3 #B7BFC7

#5E7EB1 - #889FBC - #B7BFC7

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E7EB1 0%, #889FBC 50%, #B7BFC7 100%);
    background: -webkit-linear-gradient(top, #5E7EB1 0%, #889FBC 50%, #B7BFC7 100%);
    background: linear-gradient(to bottom, #5E7EB1 0%, #889FBC 50%, #B7BFC7 100%);
}
</style>