#B5BAE5 - #5472A6 | 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 #B5BAE5 to #5472A6

#B5BAE5 #5472A6

Calculate the color between two colors, #B5BAE5 and #5472A6. 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)

#B5BAE5 - #5472A6 | 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 #B5BAE5 as 0% and #5472A6 as 100%.

0.0%	0.0% #B5BAE5	RGB 181 186 229	#B5BAE5
16.7%	16.7% #A4AEDA	RGB 164 174 218	#A4AEDA
33.3%	33.3% #94A2D0	RGB 148 162 208	#94A2D0
50.0%	50.0% #8496C5	RGB 132 150 197	#8496C5
66.7%	66.7% #748ABB	RGB 116 138 187	#748ABB
83.3%	83.3% #647EB0	RGB 100 126 176	#647EB0
100.0%	100.0% #5472A6	RGB 84 114 166	#5472A6

#B5BAE5 #A4AEDA #94A2D0 #8496C5 #748ABB #647EB0 #5472A6

#B5BAE5 - #5472A6

HSV Blend

#B5BAE5 - #5472A6 | 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 #B5BAE5 as 0% and #5472A6 as 100%.

0.0%	0.0% #B5BAE5	RGB 181 186 229	#B5BAE5
16.7%	16.7% #A2AADA	RGB 162 170 218	#A2AADA
33.3%	33.3% #909CD0	RGB 144 156 208	#909CD0
50.0%	50.0% #8090C5	RGB 128 144 197	#8090C5
66.7%	66.7% #7085BB	RGB 112 133 187	#7085BB
83.3%	83.3% #617BB0	RGB 97 123 176	#617BB0
100.0%	100.0% #5472A6	RGB 84 114 166	#5472A6

#B5BAE5 #A2AADA #909CD0 #8090C5 #7085BB #617BB0 #5472A6

#B5BAE5 - #8090C5 - #5472A6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B5BAE5 0%, #8090C5 50%, #5472A6 100%);
    background: -webkit-linear-gradient(top, #B5BAE5 0%, #8090C5 50%, #5472A6 100%);
    background: linear-gradient(to bottom, #B5BAE5 0%, #8090C5 50%, #5472A6 100%);
}
</style>