#BDC3C6 - #5A6C8C | 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 #BDC3C6 to #5A6C8C

#BDC3C6 #5A6C8C

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

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

0.0%	0.0% #BDC3C6	RGB 189 195 198	#BDC3C6
16.7%	16.7% #ACB4BC	RGB 172 180 188	#ACB4BC
33.3%	33.3% #9CA6B2	RGB 156 166 178	#9CA6B2
50.0%	50.0% #8B97A9	RGB 139 151 169	#8B97A9
66.7%	66.7% #7B899F	RGB 123 137 159	#7B899F
83.3%	83.3% #6A7A95	RGB 106 122 149	#6A7A95
100.0%	100.0% #5A6C8C	RGB 90 108 140	#5A6C8C

#BDC3C6 #ACB4BC #9CA6B2 #8B97A9 #7B899F #6A7A95 #5A6C8C

#BDC3C6 - #5A6C8C

HSV Blend

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

0.0%	0.0% #BDC3C6	RGB 189 195 198	#BDC3C6
16.7%	16.7% #A9B5BC	RGB 169 181 188	#A9B5BC
33.3%	33.3% #97A7B2	RGB 151 167 178	#97A7B2
50.0%	50.0% #8698A9	RGB 134 152 169	#8698A9
66.7%	66.7% #76899F	RGB 118 137 159	#76899F
83.3%	83.3% #677A95	RGB 103 122 149	#677A95
100.0%	100.0% #5A6C8C	RGB 90 108 140	#5A6C8C

#BDC3C6 #A9B5BC #97A7B2 #8698A9 #76899F #677A95 #5A6C8C

#BDC3C6 - #8698A9 - #5A6C8C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BDC3C6 0%, #8698A9 50%, #5A6C8C 100%);
    background: -webkit-linear-gradient(top, #BDC3C6 0%, #8698A9 50%, #5A6C8C 100%);
    background: linear-gradient(to bottom, #BDC3C6 0%, #8698A9 50%, #5A6C8C 100%);
}
</style>