#BBC3CD - #5B5CA8 | 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 #BBC3CD to #5B5CA8

#BBC3CD #5B5CA8

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

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

0.0%	0.0% #BBC3CD	RGB 187 195 205	#BBC3CD
16.7%	16.7% #ABB1C6	RGB 171 177 198	#ABB1C6
33.3%	33.3% #9BA0C0	RGB 155 160 192	#9BA0C0
50.0%	50.0% #8B8FBA	RGB 139 143 186	#8B8FBA
66.7%	66.7% #7B7EB4	RGB 123 126 180	#7B7EB4
83.3%	83.3% #6B6DAE	RGB 107 109 174	#6B6DAE
100.0%	100.0% #5B5CA8	RGB 91 92 168	#5B5CA8

#BBC3CD #ABB1C6 #9BA0C0 #8B8FBA #7B7EB4 #6B6DAE #5B5CA8

#BBC3CD - #5B5CA8

HSV Blend

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

0.0%	0.0% #BBC3CD	RGB 187 195 205	#BBC3CD
16.7%	16.7% #A9B4C6	RGB 169 180 198	#A9B4C6
33.3%	33.3% #97A4C0	RGB 151 164 192	#97A4C0
50.0%	50.0% #8793BA	RGB 135 147 186	#8793BA
66.7%	66.7% #7781B4	RGB 119 129 180	#7781B4
83.3%	83.3% #696EAE	RGB 105 110 174	#696EAE
100.0%	100.0% #5B5CA8	RGB 91 92 168	#5B5CA8

#BBC3CD #A9B4C6 #97A4C0 #8793BA #7781B4 #696EAE #5B5CA8

#BBC3CD - #8793BA - #5B5CA8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BBC3CD 0%, #8793BA 50%, #5B5CA8 100%);
    background: -webkit-linear-gradient(top, #BBC3CD 0%, #8793BA 50%, #5B5CA8 100%);
    background: linear-gradient(to bottom, #BBC3CD 0%, #8793BA 50%, #5B5CA8 100%);
}
</style>