#B3C7E3 - #4271B8 | 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 #B3C7E3 to #4271B8

#B3C7E3 #4271B8

Calculate the color between two colors, #B3C7E3 and #4271B8. 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)

#B3C7E3 - #4271B8 | 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 #B3C7E3 as 0% and #4271B8 as 100%.

0.0%	0.0% #B3C7E3	RGB 179 199 227	#B3C7E3
16.7%	16.7% #A0B8DB	RGB 160 184 219	#A0B8DB
33.3%	33.3% #8DAAD4	RGB 141 170 212	#8DAAD4
50.0%	50.0% #7A9CCD	RGB 122 156 205	#7A9CCD
66.7%	66.7% #678DC6	RGB 103 141 198	#678DC6
83.3%	83.3% #547FBF	RGB 84 127 191	#547FBF
100.0%	100.0% #4271B8	RGB 66 113 184	#4271B8

#B3C7E3 #A0B8DB #8DAAD4 #7A9CCD #678DC6 #547FBF #4271B8

#B3C7E3 - #4271B8

HSV Blend

#B3C7E3 - #4271B8 | 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 #B3C7E3 as 0% and #4271B8 as 100%.

0.0%	0.0% #B3C7E3	RGB 179 199 227	#B3C7E3
16.7%	16.7% #9DB7DB	RGB 157 183 219	#9DB7DB
33.3%	33.3% #89A8D4	RGB 137 168 212	#89A8D4
50.0%	50.0% #7599CD	RGB 117 153 205	#7599CD
66.7%	66.7% #638BC6	RGB 99 139 198	#638BC6
83.3%	83.3% #527DBF	RGB 82 125 191	#527DBF
100.0%	100.0% #4271B8	RGB 66 113 184	#4271B8

#B3C7E3 #9DB7DB #89A8D4 #7599CD #638BC6 #527DBF #4271B8

#B3C7E3 - #7599CD - #4271B8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B3C7E3 0%, #7599CD 50%, #4271B8 100%);
    background: -webkit-linear-gradient(top, #B3C7E3 0%, #7599CD 50%, #4271B8 100%);
    background: linear-gradient(to bottom, #B3C7E3 0%, #7599CD 50%, #4271B8 100%);
}
</style>