#B2BADE - #526AA3 | 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 #B2BADE to #526AA3

#B2BADE #526AA3

Calculate the color between two colors, #B2BADE and #526AA3. 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)

#B2BADE - #526AA3 | 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 #B2BADE as 0% and #526AA3 as 100%.

0.0%	0.0% #B2BADE	RGB 178 186 222	#B2BADE
16.7%	16.7% #A2ACD4	RGB 162 172 212	#A2ACD4
33.3%	33.3% #929FCA	RGB 146 159 202	#929FCA
50.0%	50.0% #8292C0	RGB 130 146 192	#8292C0
66.7%	66.7% #7284B6	RGB 114 132 182	#7284B6
83.3%	83.3% #6277AC	RGB 98 119 172	#6277AC
100.0%	100.0% #526AA3	RGB 82 106 163	#526AA3

#B2BADE #A2ACD4 #929FCA #8292C0 #7284B6 #6277AC #526AA3

#B2BADE - #526AA3

HSV Blend

#B2BADE - #526AA3 | 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 #B2BADE as 0% and #526AA3 as 100%.

0.0%	0.0% #B2BADE	RGB 178 186 222	#B2BADE
16.7%	16.7% #9FAAD4	RGB 159 170 212	#9FAAD4
33.3%	33.3% #8E9BCA	RGB 142 155 202	#8E9BCA
50.0%	50.0% #7D8DC0	RGB 125 141 192	#7D8DC0
66.7%	66.7% #6E80B6	RGB 110 128 182	#6E80B6
83.3%	83.3% #5F74AC	RGB 95 116 172	#5F74AC
100.0%	100.0% #526AA3	RGB 82 106 163	#526AA3

#B2BADE #9FAAD4 #8E9BCA #7D8DC0 #6E80B6 #5F74AC #526AA3

#B2BADE - #7D8DC0 - #526AA3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B2BADE 0%, #7D8DC0 50%, #526AA3 100%);
    background: -webkit-linear-gradient(top, #B2BADE 0%, #7D8DC0 50%, #526AA3 100%);
    background: linear-gradient(to bottom, #B2BADE 0%, #7D8DC0 50%, #526AA3 100%);
}
</style>