#B5D5FD - #5587D4 | 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 #B5D5FD to #5587D4

#B5D5FD #5587D4

Calculate the color between two colors, #B5D5FD and #5587D4. 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)

#B5D5FD - #5587D4 | 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 #B5D5FD as 0% and #5587D4 as 100%.

0.0%	0.0% #B5D5FD	RGB 181 213 253	#B5D5FD
16.7%	16.7% #A5C8F6	RGB 165 200 246	#A5C8F6
33.3%	33.3% #95BBEF	RGB 149 187 239	#95BBEF
50.0%	50.0% #85AEE8	RGB 133 174 232	#85AEE8
66.7%	66.7% #75A1E1	RGB 117 161 225	#75A1E1
83.3%	83.3% #6594DA	RGB 101 148 218	#6594DA
100.0%	100.0% #5587D4	RGB 85 135 212	#5587D4

#B5D5FD #A5C8F6 #95BBEF #85AEE8 #75A1E1 #6594DA #5587D4

#B5D5FD - #5587D4

HSV Blend

#B5D5FD - #5587D4 | 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 #B5D5FD as 0% and #5587D4 as 100%.

0.0%	0.0% #B5D5FD	RGB 181 213 253	#B5D5FD
16.7%	16.7% #A3C7F6	RGB 163 199 246	#A3C7F6
33.3%	33.3% #92B9EF	RGB 146 185 239	#92B9EF
50.0%	50.0% #81ACE8	RGB 129 172 232	#81ACE8
66.7%	66.7% #729FE1	RGB 114 159 225	#729FE1
83.3%	83.3% #6393DA	RGB 99 147 218	#6393DA
100.0%	100.0% #5587D4	RGB 85 135 212	#5587D4

#B5D5FD #A3C7F6 #92B9EF #81ACE8 #729FE1 #6393DA #5587D4

#B5D5FD - #81ACE8 - #5587D4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B5D5FD 0%, #81ACE8 50%, #5587D4 100%);
    background: -webkit-linear-gradient(top, #B5D5FD 0%, #81ACE8 50%, #5587D4 100%);
    background: linear-gradient(to bottom, #B5D5FD 0%, #81ACE8 50%, #5587D4 100%);
}
</style>