#B2D4FC - #5286D3 | 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 #B2D4FC to #5286D3

#B2D4FC #5286D3

Calculate the color between two colors, #B2D4FC and #5286D3. 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)

#B2D4FC - #5286D3 | 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 #B2D4FC as 0% and #5286D3 as 100%.

0.0%	0.0% #B2D4FC	RGB 178 212 252	#B2D4FC
16.7%	16.7% #A2C7F5	RGB 162 199 245	#A2C7F5
33.3%	33.3% #92BAEE	RGB 146 186 238	#92BAEE
50.0%	50.0% #82ADE7	RGB 130 173 231	#82ADE7
66.7%	66.7% #72A0E0	RGB 114 160 224	#72A0E0
83.3%	83.3% #6293D9	RGB 98 147 217	#6293D9
100.0%	100.0% #5286D3	RGB 82 134 211	#5286D3

#B2D4FC #A2C7F5 #92BAEE #82ADE7 #72A0E0 #6293D9 #5286D3

#B2D4FC - #5286D3

HSV Blend

#B2D4FC - #5286D3 | 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 #B2D4FC as 0% and #5286D3 as 100%.

0.0%	0.0% #B2D4FC	RGB 178 212 252	#B2D4FC
16.7%	16.7% #A0C6F5	RGB 160 198 245	#A0C6F5
33.3%	33.3% #8FB9EE	RGB 143 185 238	#8FB9EE
50.0%	50.0% #7EABE7	RGB 126 171 231	#7EABE7
66.7%	66.7% #6F9FE0	RGB 111 159 224	#6F9FE0
83.3%	83.3% #6092D9	RGB 96 146 217	#6092D9
100.0%	100.0% #5286D3	RGB 82 134 211	#5286D3

#B2D4FC #A0C6F5 #8FB9EE #7EABE7 #6F9FE0 #6092D9 #5286D3

#B2D4FC - #7EABE7 - #5286D3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B2D4FC 0%, #7EABE7 50%, #5286D3 100%);
    background: -webkit-linear-gradient(top, #B2D4FC 0%, #7EABE7 50%, #5286D3 100%);
    background: linear-gradient(to bottom, #B2D4FC 0%, #7EABE7 50%, #5286D3 100%);
}
</style>