#B2D5E0 - #5E89A9 | 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 #B2D5E0 to #5E89A9

#B2D5E0 #5E89A9

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

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

0.0%	0.0% #B2D5E0	RGB 178 213 224	#B2D5E0
16.7%	16.7% #A4C8D6	RGB 164 200 214	#A4C8D6
33.3%	33.3% #96BBCD	RGB 150 187 205	#96BBCD
50.0%	50.0% #88AFC4	RGB 136 175 196	#88AFC4
66.7%	66.7% #7AA2BB	RGB 122 162 187	#7AA2BB
83.3%	83.3% #6C95B2	RGB 108 149 178	#6C95B2
100.0%	100.0% #5E89A9	RGB 94 137 169	#5E89A9

#B2D5E0 #A4C8D6 #96BBCD #88AFC4 #7AA2BB #6C95B2 #5E89A9

#B2D5E0 - #5E89A9

HSV Blend

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

0.0%	0.0% #B2D5E0	RGB 178 213 224	#B2D5E0
16.7%	16.7% #A2C8D6	RGB 162 200 214	#A2C8D6
33.3%	33.3% #93BBCD	RGB 147 187 205	#93BBCD
50.0%	50.0% #84AFC4	RGB 132 175 196	#84AFC4
66.7%	66.7% #77A2BB	RGB 119 162 187	#77A2BB
83.3%	83.3% #6A95B2	RGB 106 149 178	#6A95B2
100.0%	100.0% #5E89A9	RGB 94 137 169	#5E89A9

#B2D5E0 #A2C8D6 #93BBCD #84AFC4 #77A2BB #6A95B2 #5E89A9

#B2D5E0 - #84AFC4 - #5E89A9

CSS codes

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

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