#BBC4E3 - #5C75AB | 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 #BBC4E3 to #5C75AB

#BBC4E3 #5C75AB

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

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

0.0%	0.0% #BBC4E3	RGB 187 196 227	#BBC4E3
16.7%	16.7% #ABB6D9	RGB 171 182 217	#ABB6D9
33.3%	33.3% #9BA9D0	RGB 155 169 208	#9BA9D0
50.0%	50.0% #8B9CC7	RGB 139 156 199	#8B9CC7
66.7%	66.7% #7B8FBD	RGB 123 143 189	#7B8FBD
83.3%	83.3% #6B82B4	RGB 107 130 180	#6B82B4
100.0%	100.0% #5C75AB	RGB 92 117 171	#5C75AB

#BBC4E3 #ABB6D9 #9BA9D0 #8B9CC7 #7B8FBD #6B82B4 #5C75AB

#BBC4E3 - #5C75AB

HSV Blend

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

0.0%	0.0% #BBC4E3	RGB 187 196 227	#BBC4E3
16.7%	16.7% #A8B4D9	RGB 168 180 217	#A8B4D9
33.3%	33.3% #97A6D0	RGB 151 166 208	#97A6D0
50.0%	50.0% #8798C7	RGB 135 152 199	#8798C7
66.7%	66.7% #788CBD	RGB 120 140 189	#788CBD
83.3%	83.3% #6980B4	RGB 105 128 180	#6980B4
100.0%	100.0% #5C75AB	RGB 92 117 171	#5C75AB

#BBC4E3 #A8B4D9 #97A6D0 #8798C7 #788CBD #6980B4 #5C75AB

#BBC4E3 - #8798C7 - #5C75AB

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BBC4E3 0%, #8798C7 50%, #5C75AB 100%);
    background: -webkit-linear-gradient(top, #BBC4E3 0%, #8798C7 50%, #5C75AB 100%);
    background: linear-gradient(to bottom, #BBC4E3 0%, #8798C7 50%, #5C75AB 100%);
}
</style>