#BBCBCF - #5C81A8 | 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 #BBCBCF to #5C81A8

#BBCBCF #5C81A8

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

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

0.0%	0.0% #BBCBCF	RGB 187 203 207	#BBCBCF
16.7%	16.7% #ABBEC8	RGB 171 190 200	#ABBEC8
33.3%	33.3% #9BB2C2	RGB 155 178 194	#9BB2C2
50.0%	50.0% #8BA6BB	RGB 139 166 187	#8BA6BB
66.7%	66.7% #7B99B5	RGB 123 153 181	#7B99B5
83.3%	83.3% #6B8DAE	RGB 107 141 174	#6B8DAE
100.0%	100.0% #5C81A8	RGB 92 129 168	#5C81A8

#BBCBCF #ABBEC8 #9BB2C2 #8BA6BB #7B99B5 #6B8DAE #5C81A8

#BBCBCF - #5C81A8

HSV Blend

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

0.0%	0.0% #BBCBCF	RGB 187 203 207	#BBCBCF
16.7%	16.7% #A9C0C8	RGB 169 192 200	#A9C0C8
33.3%	33.3% #98B5C2	RGB 152 181 194	#98B5C2
50.0%	50.0% #88A9BB	RGB 136 169 187	#88A9BB
66.7%	66.7% #789CB5	RGB 120 156 181	#789CB5
83.3%	83.3% #698EAE	RGB 105 142 174	#698EAE
100.0%	100.0% #5C81A8	RGB 92 129 168	#5C81A8

#BBCBCF #A9C0C8 #98B5C2 #88A9BB #789CB5 #698EAE #5C81A8

#BBCBCF - #88A9BB - #5C81A8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BBCBCF 0%, #88A9BB 50%, #5C81A8 100%);
    background: -webkit-linear-gradient(top, #BBCBCF 0%, #88A9BB 50%, #5C81A8 100%);
    background: linear-gradient(to bottom, #BBCBCF 0%, #88A9BB 50%, #5C81A8 100%);
}
</style>