#BBC4C2 - #56898B | 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 #BBC4C2 to #56898B

#BBC4C2 #56898B

Calculate the color between two colors, #BBC4C2 and #56898B. 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)

#BBC4C2 - #56898B | 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 #BBC4C2 as 0% and #56898B as 100%.

0.0%	0.0% #BBC4C2	RGB 187 196 194	#BBC4C2
16.7%	16.7% #AABAB8	RGB 170 186 184	#AABAB8
33.3%	33.3% #99B0AF	RGB 153 176 175	#99B0AF
50.0%	50.0% #88A6A6	RGB 136 166 166	#88A6A6
66.7%	66.7% #779C9D	RGB 119 156 157	#779C9D
83.3%	83.3% #669294	RGB 102 146 148	#669294
100.0%	100.0% #56898B	RGB 86 137 139	#56898B

#BBC4C2 #AABAB8 #99B0AF #88A6A6 #779C9D #669294 #56898B

#BBC4C2 - #56898B

HSV Blend

#BBC4C2 - #56898B | 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 #BBC4C2 as 0% and #56898B as 100%.

0.0%	0.0% #BBC4C2	RGB 187 196 194	#BBC4C2
16.7%	16.7% #A7BAB7	RGB 167 186 183	#A7BAB7
33.3%	33.3% #95B1AD	RGB 149 177 173	#95B1AD
50.0%	50.0% #83A7A4	RGB 131 167 164	#83A7A4
66.7%	66.7% #739E9B	RGB 115 158 155	#739E9B
83.3%	83.3% #649494	RGB 100 148 148	#649494
100.0%	100.0% #56898B	RGB 86 137 139	#56898B

#BBC4C2 #A7BAB7 #95B1AD #83A7A4 #739E9B #649494 #56898B

#BBC4C2 - #83A7A4 - #56898B

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BBC4C2 0%, #83A7A4 50%, #56898B 100%);
    background: -webkit-linear-gradient(top, #BBC4C2 0%, #83A7A4 50%, #56898B 100%);
    background: linear-gradient(to bottom, #BBC4C2 0%, #83A7A4 50%, #56898B 100%);
}
</style>