#4D7E9F - #BAC2BD | 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 #4D7E9F to #BAC2BD

#4D7E9F #BAC2BD

Calculate the color between two colors, #4D7E9F and #BAC2BD. 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)

#4D7E9F - #BAC2BD | 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 #4D7E9F as 0% and #BAC2BD as 100%.

0.0%	0.0% #4D7E9F	RGB 77 126 159	#4D7E9F
16.7%	16.7% #5F89A4	RGB 95 137 164	#5F89A4
33.3%	33.3% #7194A9	RGB 113 148 169	#7194A9
50.0%	50.0% #83A0AE	RGB 131 160 174	#83A0AE
66.7%	66.7% #95ABB3	RGB 149 171 179	#95ABB3
83.3%	83.3% #A7B6B8	RGB 167 182 184	#A7B6B8
100.0%	100.0% #BAC2BD	RGB 186 194 189	#BAC2BD

#4D7E9F #5F89A4 #7194A9 #83A0AE #95ABB3 #A7B6B8 #BAC2BD

#4D7E9F - #BAC2BD

HSV Blend

#4D7E9F - #BAC2BD | 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 #4D7E9F as 0% and #BAC2BD as 100%.

0.0%	0.0% #4D7E9F	RGB 77 126 159	#4D7E9F
16.7%	16.7% #5C94A4	RGB 92 148 164	#5C94A4
33.3%	33.3% #6DA7AA	RGB 109 167 170	#6DA7AA
50.0%	50.0% #7FB0AB	RGB 127 176 171	#7FB0AB
66.7%	66.7% #91B6AC	RGB 145 182 172	#91B6AC
83.3%	83.3% #A5BCB1	RGB 165 188 177	#A5BCB1
100.0%	100.0% #BAC2BD	RGB 186 194 189	#BAC2BD

#4D7E9F #5C94A4 #6DA7AA #7FB0AB #91B6AC #A5BCB1 #BAC2BD

#4D7E9F - #7FB0AB - #BAC2BD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4D7E9F 0%, #7FB0AB 50%, #BAC2BD 100%);
    background: -webkit-linear-gradient(top, #4D7E9F 0%, #7FB0AB 50%, #BAC2BD 100%);
    background: linear-gradient(to bottom, #4D7E9F 0%, #7FB0AB 50%, #BAC2BD 100%);
}
</style>