#BDC6C3 - #5A8A8C | 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 #BDC6C3 to #5A8A8C

#BDC6C3 #5A8A8C

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

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

0.0%	0.0% #BDC6C3	RGB 189 198 195	#BDC6C3
16.7%	16.7% #ACBCB9	RGB 172 188 185	#ACBCB9
33.3%	33.3% #9CB2B0	RGB 156 178 176	#9CB2B0
50.0%	50.0% #8BA8A7	RGB 139 168 167	#8BA8A7
66.7%	66.7% #7B9E9E	RGB 123 158 158	#7B9E9E
83.3%	83.3% #6A9495	RGB 106 148 149	#6A9495
100.0%	100.0% #5A8A8C	RGB 90 138 140	#5A8A8C

#BDC6C3 #ACBCB9 #9CB2B0 #8BA8A7 #7B9E9E #6A9495 #5A8A8C

#BDC6C3 - #5A8A8C

HSV Blend

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

0.0%	0.0% #BDC6C3	RGB 189 198 195	#BDC6C3
16.7%	16.7% #A9BCB7	RGB 169 188 183	#A9BCB7
33.3%	33.3% #97B2AD	RGB 151 178 173	#97B2AD
50.0%	50.0% #86A9A4	RGB 134 169 164	#86A9A4
66.7%	66.7% #769F9B	RGB 118 159 155	#769F9B
83.3%	83.3% #679594	RGB 103 149 148	#679594
100.0%	100.0% #5A8A8C	RGB 90 138 140	#5A8A8C

#BDC6C3 #A9BCB7 #97B2AD #86A9A4 #769F9B #679594 #5A8A8C

#BDC6C3 - #86A9A4 - #5A8A8C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BDC6C3 0%, #86A9A4 50%, #5A8A8C 100%);
    background: -webkit-linear-gradient(top, #BDC6C3 0%, #86A9A4 50%, #5A8A8C 100%);
    background: linear-gradient(to bottom, #BDC6C3 0%, #86A9A4 50%, #5A8A8C 100%);
}
</style>