#5E7397 - #BAB5B3 | 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 #5E7397 to #BAB5B3

#5E7397 #BAB5B3

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

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

0.0%	0.0% #5E7397	RGB 94 115 151	#5E7397
16.7%	16.7% #6D7E9B	RGB 109 126 155	#6D7E9B
33.3%	33.3% #7C89A0	RGB 124 137 160	#7C89A0
50.0%	50.0% #8C94A5	RGB 140 148 165	#8C94A5
66.7%	66.7% #9B9FA9	RGB 155 159 169	#9B9FA9
83.3%	83.3% #AAAAAE	RGB 170 170 174	#AAAAAE
100.0%	100.0% #BAB5B3	RGB 186 181 179	#BAB5B3

#5E7397 #6D7E9B #7C89A0 #8C94A5 #9B9FA9 #AAAAAE #BAB5B3

#5E7397 - #BAB5B3

HSV Blend

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

0.0%	0.0% #5E7397	RGB 94 115 151	#5E7397
16.7%	16.7% #6E6A9C	RGB 110 106 156	#6E6A9C
33.3%	33.3% #8D77A2	RGB 141 119 162	#8D77A2
50.0%	50.0% #A785A8	RGB 167 133 168	#A785A8
66.7%	66.7% #AE94A3	RGB 174 148 163	#AE94A3
83.3%	83.3% #B4A3A5	RGB 180 163 165	#B4A3A5
100.0%	100.0% #BAB5B3	RGB 186 181 179	#BAB5B3

#5E7397 #6E6A9C #8D77A2 #A785A8 #AE94A3 #B4A3A5 #BAB5B3

#5E7397 - #A785A8 - #BAB5B3

CSS codes

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

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