#B2D9FB - #538DD2 | 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 #B2D9FB to #538DD2

#B2D9FB #538DD2

Calculate the color between two colors, #B2D9FB and #538DD2. 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)

#B2D9FB - #538DD2 | 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 #B2D9FB as 0% and #538DD2 as 100%.

0.0%	0.0% #B2D9FB	RGB 178 217 251	#B2D9FB
16.7%	16.7% #A2CCF4	RGB 162 204 244	#A2CCF4
33.3%	33.3% #92BFED	RGB 146 191 237	#92BFED
50.0%	50.0% #82B3E6	RGB 130 179 230	#82B3E6
66.7%	66.7% #72A6DF	RGB 114 166 223	#72A6DF
83.3%	83.3% #6299D8	RGB 98 153 216	#6299D8
100.0%	100.0% #538DD2	RGB 83 141 210	#538DD2

#B2D9FB #A2CCF4 #92BFED #82B3E6 #72A6DF #6299D8 #538DD2

#B2D9FB - #538DD2

HSV Blend

#B2D9FB - #538DD2 | 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 #B2D9FB as 0% and #538DD2 as 100%.

0.0%	0.0% #B2D9FB	RGB 178 217 251	#B2D9FB
16.7%	16.7% #A0CCF4	RGB 160 204 244	#A0CCF4
33.3%	33.3% #8FBFED	RGB 143 191 237	#8FBFED
50.0%	50.0% #7FB2E6	RGB 127 178 230	#7FB2E6
66.7%	66.7% #6FA5DF	RGB 111 165 223	#6FA5DF
83.3%	83.3% #6199D8	RGB 97 153 216	#6199D8
100.0%	100.0% #538DD2	RGB 83 141 210	#538DD2

#B2D9FB #A0CCF4 #8FBFED #7FB2E6 #6FA5DF #6199D8 #538DD2

#B2D9FB - #7FB2E6 - #538DD2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B2D9FB 0%, #7FB2E6 50%, #538DD2 100%);
    background: -webkit-linear-gradient(top, #B2D9FB 0%, #7FB2E6 50%, #538DD2 100%);
    background: linear-gradient(to bottom, #B2D9FB 0%, #7FB2E6 50%, #538DD2 100%);
}
</style>