#B5BECC - #5C708C | 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 #B5BECC to #5C708C

#B5BECC #5C708C

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

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

0.0%	0.0% #B5BECC	RGB 181 190 204	#B5BECC
16.7%	16.7% #A6B1C1	RGB 166 177 193	#A6B1C1
33.3%	33.3% #97A4B6	RGB 151 164 182	#97A4B6
50.0%	50.0% #8897AC	RGB 136 151 172	#8897AC
66.7%	66.7% #798AA1	RGB 121 138 161	#798AA1
83.3%	83.3% #6A7D96	RGB 106 125 150	#6A7D96
100.0%	100.0% #5C708C	RGB 92 112 140	#5C708C

#B5BECC #A6B1C1 #97A4B6 #8897AC #798AA1 #6A7D96 #5C708C

#B5BECC - #5C708C

HSV Blend

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

0.0%	0.0% #B5BECC	RGB 181 190 204	#B5BECC
16.7%	16.7% #A4AFC1	RGB 164 175 193	#A4AFC1
33.3%	33.3% #94A1B6	RGB 148 161 182	#94A1B6
50.0%	50.0% #8494AC	RGB 132 148 172	#8494AC
66.7%	66.7% #7687A1	RGB 118 135 161	#7687A1
83.3%	83.3% #687B96	RGB 104 123 150	#687B96
100.0%	100.0% #5C708C	RGB 92 112 140	#5C708C

#B5BECC #A4AFC1 #94A1B6 #8494AC #7687A1 #687B96 #5C708C

#B5BECC - #8494AC - #5C708C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B5BECC 0%, #8494AC 50%, #5C708C 100%);
    background: -webkit-linear-gradient(top, #B5BECC 0%, #8494AC 50%, #5C708C 100%);
    background: linear-gradient(to bottom, #B5BECC 0%, #8494AC 50%, #5C708C 100%);
}
</style>