#BABFC6 - #5A8384 | 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 #BABFC6 to #5A8384

#BABFC6 #5A8384

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

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

0.0%	0.0% #BABFC6	RGB 186 191 198	#BABFC6
16.7%	16.7% #AAB5BB	RGB 170 181 187	#AAB5BB
33.3%	33.3% #9AABB0	RGB 154 171 176	#9AABB0
50.0%	50.0% #8AA1A5	RGB 138 161 165	#8AA1A5
66.7%	66.7% #7A979A	RGB 122 151 154	#7A979A
83.3%	83.3% #6A8D8F	RGB 106 141 143	#6A8D8F
100.0%	100.0% #5A8384	RGB 90 131 132	#5A8384

#BABFC6 #AAB5BB #9AABB0 #8AA1A5 #7A979A #6A8D8F #5A8384

#BABFC6 - #5A8384

HSV Blend

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

0.0%	0.0% #BABFC6	RGB 186 191 198	#BABFC6
16.7%	16.7% #A7B1BB	RGB 167 177 187	#A7B1BB
33.3%	33.3% #96A5B0	RGB 150 165 176	#96A5B0
50.0%	50.0% #859BA5	RGB 133 155 165	#859BA5
66.7%	66.7% #76929A	RGB 118 146 154	#76929A
83.3%	83.3% #678A8F	RGB 103 138 143	#678A8F
100.0%	100.0% #5A8384	RGB 90 131 132	#5A8384

#BABFC6 #A7B1BB #96A5B0 #859BA5 #76929A #678A8F #5A8384

#BABFC6 - #859BA5 - #5A8384

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BABFC6 0%, #859BA5 50%, #5A8384 100%);
    background: -webkit-linear-gradient(top, #BABFC6 0%, #859BA5 50%, #5A8384 100%);
    background: linear-gradient(to bottom, #BABFC6 0%, #859BA5 50%, #5A8384 100%);
}
</style>