#B8C8F9 - #5576CC | 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 #B8C8F9 to #5576CC

#B8C8F9 #5576CC

Calculate the color between two colors, #B8C8F9 and #5576CC. 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)

#B8C8F9 - #5576CC | 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 #B8C8F9 as 0% and #5576CC as 100%.

0.0%	0.0% #B8C8F9	RGB 184 200 249	#B8C8F9
16.7%	16.7% #A7BAF1	RGB 167 186 241	#A7BAF1
33.3%	33.3% #97ACEA	RGB 151 172 234	#97ACEA
50.0%	50.0% #869FE2	RGB 134 159 226	#869FE2
66.7%	66.7% #7691DB	RGB 118 145 219	#7691DB
83.3%	83.3% #6583D3	RGB 101 131 211	#6583D3
100.0%	100.0% #5576CC	RGB 85 118 204	#5576CC

#B8C8F9 #A7BAF1 #97ACEA #869FE2 #7691DB #6583D3 #5576CC

#B8C8F9 - #5576CC

HSV Blend

#B8C8F9 - #5576CC | 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 #B8C8F9 as 0% and #5576CC as 100%.

0.0%	0.0% #B8C8F9	RGB 184 200 249	#B8C8F9
16.7%	16.7% #A5B8F1	RGB 165 184 241	#A5B8F1
33.3%	33.3% #93A9EA	RGB 147 169 234	#93A9EA
50.0%	50.0% #829BE2	RGB 130 155 226	#829BE2
66.7%	66.7% #728EDB	RGB 114 142 219	#728EDB
83.3%	83.3% #6381D3	RGB 99 129 211	#6381D3
100.0%	100.0% #5576CC	RGB 85 118 204	#5576CC

#B8C8F9 #A5B8F1 #93A9EA #829BE2 #728EDB #6381D3 #5576CC

#B8C8F9 - #829BE2 - #5576CC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B8C8F9 0%, #829BE2 50%, #5576CC 100%);
    background: -webkit-linear-gradient(top, #B8C8F9 0%, #829BE2 50%, #5576CC 100%);
    background: linear-gradient(to bottom, #B8C8F9 0%, #829BE2 50%, #5576CC 100%);
}
</style>