#B7BFCD - #577B8C | 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 #B7BFCD to #577B8C

#B7BFCD #577B8C

Calculate the color between two colors, #B7BFCD and #577B8C. 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)

#B7BFCD - #577B8C | 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 #B7BFCD as 0% and #577B8C as 100%.

0.0%	0.0% #B7BFCD	RGB 183 191 205	#B7BFCD
16.7%	16.7% #A7B3C2	RGB 167 179 194	#A7B3C2
33.3%	33.3% #97A8B7	RGB 151 168 183	#97A8B7
50.0%	50.0% #879DAC	RGB 135 157 172	#879DAC
66.7%	66.7% #7791A1	RGB 119 145 161	#7791A1
83.3%	83.3% #678696	RGB 103 134 150	#678696
100.0%	100.0% #577B8C	RGB 87 123 140	#577B8C

#B7BFCD #A7B3C2 #97A8B7 #879DAC #7791A1 #678696 #577B8C

#B7BFCD - #577B8C

HSV Blend

#B7BFCD - #577B8C | 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 #B7BFCD as 0% and #577B8C as 100%.

0.0%	0.0% #B7BFCD	RGB 183 191 205	#B7BFCD
16.7%	16.7% #A4B0C2	RGB 164 176 194	#A4B0C2
33.3%	33.3% #93A4B7	RGB 147 164 183	#93A4B7
50.0%	50.0% #8298AC	RGB 130 152 172	#8298AC
66.7%	66.7% #738DA1	RGB 115 141 161	#738DA1
83.3%	83.3% #648496	RGB 100 132 150	#648496
100.0%	100.0% #577B8C	RGB 87 123 140	#577B8C

#B7BFCD #A4B0C2 #93A4B7 #8298AC #738DA1 #648496 #577B8C

#B7BFCD - #8298AC - #577B8C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B7BFCD 0%, #8298AC 50%, #577B8C 100%);
    background: -webkit-linear-gradient(top, #B7BFCD 0%, #8298AC 50%, #577B8C 100%);
    background: linear-gradient(to bottom, #B7BFCD 0%, #8298AC 50%, #577B8C 100%);
}
</style>