#6BA1AD - #BABEC1 | 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 #6BA1AD to #BABEC1

#6BA1AD #BABEC1

Calculate the color between two colors, #6BA1AD and #BABEC1. 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)

#6BA1AD - #BABEC1 | 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 #6BA1AD as 0% and #BABEC1 as 100%.

0.0%	0.0% #6BA1AD	RGB 107 161 173	#6BA1AD
16.7%	16.7% #78A5B0	RGB 120 165 176	#78A5B0
33.3%	33.3% #85AAB3	RGB 133 170 179	#85AAB3
50.0%	50.0% #92AFB7	RGB 146 175 183	#92AFB7
66.7%	66.7% #9FB4BA	RGB 159 180 186	#9FB4BA
83.3%	83.3% #ACB9BD	RGB 172 185 189	#ACB9BD
100.0%	100.0% #BABEC1	RGB 186 190 193	#BABEC1

#6BA1AD #78A5B0 #85AAB3 #92AFB7 #9FB4BA #ACB9BD #BABEC1

#6BA1AD - #BABEC1

HSV Blend

#6BA1AD - #BABEC1 | 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 #6BA1AD as 0% and #BABEC1 as 100%.

0.0%	0.0% #6BA1AD	RGB 107 161 173	#6BA1AD
16.7%	16.7% #77A3B0	RGB 119 163 176	#77A3B0
33.3%	33.3% #83A7B3	RGB 131 167 179	#83A7B3
50.0%	50.0% #90ABB7	RGB 144 171 183	#90ABB7
66.7%	66.7% #9EB0BA	RGB 158 176 186	#9EB0BA
83.3%	83.3% #ABB6BD	RGB 171 182 189	#ABB6BD
100.0%	100.0% #BABEC1	RGB 186 190 193	#BABEC1

#6BA1AD #77A3B0 #83A7B3 #90ABB7 #9EB0BA #ABB6BD #BABEC1

#6BA1AD - #90ABB7 - #BABEC1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6BA1AD 0%, #90ABB7 50%, #BABEC1 100%);
    background: -webkit-linear-gradient(top, #6BA1AD 0%, #90ABB7 50%, #BABEC1 100%);
    background: linear-gradient(to bottom, #6BA1AD 0%, #90ABB7 50%, #BABEC1 100%);
}
</style>