#5A8FC7 - #B9CCD5 | 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 #5A8FC7 to #B9CCD5

#5A8FC7 #B9CCD5

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

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

0.0%	0.0% #5A8FC7	RGB 90 143 199	#5A8FC7
16.7%	16.7% #6999C9	RGB 105 153 201	#6999C9
33.3%	33.3% #79A3CB	RGB 121 163 203	#79A3CB
50.0%	50.0% #89ADCE	RGB 137 173 206	#89ADCE
66.7%	66.7% #99B7D0	RGB 153 183 208	#99B7D0
83.3%	83.3% #A9C1D2	RGB 169 193 210	#A9C1D2
100.0%	100.0% #B9CCD5	RGB 185 204 213	#B9CCD5

#5A8FC7 #6999C9 #79A3CB #89ADCE #99B7D0 #A9C1D2 #B9CCD5

#5A8FC7 - #B9CCD5

HSV Blend

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

0.0%	0.0% #5A8FC7	RGB 90 143 199	#5A8FC7
16.7%	16.7% #699AC9	RGB 105 154 201	#699AC9
33.3%	33.3% #78A6CB	RGB 120 166 203	#78A6CB
50.0%	50.0% #88B0CE	RGB 136 176 206	#88B0CE
66.7%	66.7% #98BAD0	RGB 152 186 208	#98BAD0
83.3%	83.3% #A8C3D2	RGB 168 195 210	#A8C3D2
100.0%	100.0% #B9CCD5	RGB 185 204 213	#B9CCD5

#5A8FC7 #699AC9 #78A6CB #88B0CE #98BAD0 #A8C3D2 #B9CCD5

#5A8FC7 - #88B0CE - #B9CCD5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5A8FC7 0%, #88B0CE 50%, #B9CCD5 100%);
    background: -webkit-linear-gradient(top, #5A8FC7 0%, #88B0CE 50%, #B9CCD5 100%);
    background: linear-gradient(to bottom, #5A8FC7 0%, #88B0CE 50%, #B9CCD5 100%);
}
</style>