#B7BFEB - #556DB6 | 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 #B7BFEB to #556DB6

#B7BFEB #556DB6

Calculate the color between two colors, #B7BFEB and #556DB6. 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)

#B7BFEB - #556DB6 | 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 #B7BFEB as 0% and #556DB6 as 100%.

0.0%	0.0% #B7BFEB	RGB 183 191 235	#B7BFEB
16.7%	16.7% #A6B1E2	RGB 166 177 226	#A6B1E2
33.3%	33.3% #96A3D9	RGB 150 163 217	#96A3D9
50.0%	50.0% #8696D0	RGB 134 150 208	#8696D0
66.7%	66.7% #7588C7	RGB 117 136 199	#7588C7
83.3%	83.3% #657ABE	RGB 101 122 190	#657ABE
100.0%	100.0% #556DB6	RGB 85 109 182	#556DB6

#B7BFEB #A6B1E2 #96A3D9 #8696D0 #7588C7 #657ABE #556DB6

#B7BFEB - #556DB6

HSV Blend

#B7BFEB - #556DB6 | 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 #B7BFEB as 0% and #556DB6 as 100%.

0.0%	0.0% #B7BFEB	RGB 183 191 235	#B7BFEB
16.7%	16.7% #A4AEE2	RGB 164 174 226	#A4AEE2
33.3%	33.3% #929FD9	RGB 146 159 217	#929FD9
50.0%	50.0% #8191D0	RGB 129 145 208	#8191D0
66.7%	66.7% #7184C7	RGB 113 132 199	#7184C7
83.3%	83.3% #6378BE	RGB 99 120 190	#6378BE
100.0%	100.0% #556DB6	RGB 85 109 182	#556DB6

#B7BFEB #A4AEE2 #929FD9 #8191D0 #7184C7 #6378BE #556DB6

#B7BFEB - #8191D0 - #556DB6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B7BFEB 0%, #8191D0 50%, #556DB6 100%);
    background: -webkit-linear-gradient(top, #B7BFEB 0%, #8191D0 50%, #556DB6 100%);
    background: linear-gradient(to bottom, #B7BFEB 0%, #8191D0 50%, #556DB6 100%);
}
</style>