#B8C7E2 - #5C78AA | 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 #B8C7E2 to #5C78AA

#B8C7E2 #5C78AA

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

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

0.0%	0.0% #B8C7E2	RGB 184 199 226	#B8C7E2
16.7%	16.7% #A8B9D8	RGB 168 185 216	#A8B9D8
33.3%	33.3% #99ACCF	RGB 153 172 207	#99ACCF
50.0%	50.0% #8A9FC6	RGB 138 159 198	#8A9FC6
66.7%	66.7% #7A92BC	RGB 122 146 188	#7A92BC
83.3%	83.3% #6B85B3	RGB 107 133 179	#6B85B3
100.0%	100.0% #5C78AA	RGB 92 120 170	#5C78AA

#B8C7E2 #A8B9D8 #99ACCF #8A9FC6 #7A92BC #6B85B3 #5C78AA

#B8C7E2 - #5C78AA

HSV Blend

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

0.0%	0.0% #B8C7E2	RGB 184 199 226	#B8C7E2
16.7%	16.7% #A6B8D8	RGB 166 184 216	#A6B8D8
33.3%	33.3% #95AACF	RGB 149 170 207	#95AACF
50.0%	50.0% #869DC6	RGB 134 157 198	#869DC6
66.7%	66.7% #7790BC	RGB 119 144 188	#7790BC
83.3%	83.3% #6983B3	RGB 105 131 179	#6983B3
100.0%	100.0% #5C78AA	RGB 92 120 170	#5C78AA

#B8C7E2 #A6B8D8 #95AACF #869DC6 #7790BC #6983B3 #5C78AA

#B8C7E2 - #869DC6 - #5C78AA

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B8C7E2 0%, #869DC6 50%, #5C78AA 100%);
    background: -webkit-linear-gradient(top, #B8C7E2 0%, #869DC6 50%, #5C78AA 100%);
    background: linear-gradient(to bottom, #B8C7E2 0%, #869DC6 50%, #5C78AA 100%);
}
</style>