#BBC7E7 - #5C78B1 | 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 #BBC7E7 to #5C78B1

#BBC7E7 #5C78B1

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

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

0.0%	0.0% #BBC7E7	RGB 187 199 231	#BBC7E7
16.7%	16.7% #ABB9DE	RGB 171 185 222	#ABB9DE
33.3%	33.3% #9BACD5	RGB 155 172 213	#9BACD5
50.0%	50.0% #8B9FCC	RGB 139 159 204	#8B9FCC
66.7%	66.7% #7B92C3	RGB 123 146 195	#7B92C3
83.3%	83.3% #6B85BA	RGB 107 133 186	#6B85BA
100.0%	100.0% #5C78B1	RGB 92 120 177	#5C78B1

#BBC7E7 #ABB9DE #9BACD5 #8B9FCC #7B92C3 #6B85BA #5C78B1

#BBC7E7 - #5C78B1

HSV Blend

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

0.0%	0.0% #BBC7E7	RGB 187 199 231	#BBC7E7
16.7%	16.7% #A8B7DE	RGB 168 183 222	#A8B7DE
33.3%	33.3% #97A9D5	RGB 151 169 213	#97A9D5
50.0%	50.0% #879CCC	RGB 135 156 204	#879CCC
66.7%	66.7% #788FC3	RGB 120 143 195	#788FC3
83.3%	83.3% #6983BA	RGB 105 131 186	#6983BA
100.0%	100.0% #5C78B1	RGB 92 120 177	#5C78B1

#BBC7E7 #A8B7DE #97A9D5 #879CCC #788FC3 #6983BA #5C78B1

#BBC7E7 - #879CCC - #5C78B1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BBC7E7 0%, #879CCC 50%, #5C78B1 100%);
    background: -webkit-linear-gradient(top, #BBC7E7 0%, #879CCC 50%, #5C78B1 100%);
    background: linear-gradient(to bottom, #BBC7E7 0%, #879CCC 50%, #5C78B1 100%);
}
</style>