#C3D5E5 - #5882B8 | 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 #C3D5E5 to #5882B8

#C3D5E5 #5882B8

Calculate the color between two colors, #C3D5E5 and #5882B8. 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)

#C3D5E5 - #5882B8 | 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 #C3D5E5 as 0% and #5882B8 as 100%.

0.0%	0.0% #C3D5E5	RGB 195 213 229	#C3D5E5
16.7%	16.7% #B1C7DD	RGB 177 199 221	#B1C7DD
33.3%	33.3% #9FB9D6	RGB 159 185 214	#9FB9D6
50.0%	50.0% #8DABCE	RGB 141 171 206	#8DABCE
66.7%	66.7% #7B9DC7	RGB 123 157 199	#7B9DC7
83.3%	83.3% #698FBF	RGB 105 143 191	#698FBF
100.0%	100.0% #5882B8	RGB 88 130 184	#5882B8

#C3D5E5 #B1C7DD #9FB9D6 #8DABCE #7B9DC7 #698FBF #5882B8

#C3D5E5 - #5882B8

HSV Blend

#C3D5E5 - #5882B8 | 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 #C3D5E5 as 0% and #5882B8 as 100%.

0.0%	0.0% #C3D5E5	RGB 195 213 229	#C3D5E5
16.7%	16.7% #AEC6DD	RGB 174 198 221	#AEC6DD
33.3%	33.3% #9BB8D6	RGB 155 184 214	#9BB8D6
50.0%	50.0% #89AACE	RGB 137 170 206	#89AACE
66.7%	66.7% #779CC7	RGB 119 156 199	#779CC7
83.3%	83.3% #678FBF	RGB 103 143 191	#678FBF
100.0%	100.0% #5882B8	RGB 88 130 184	#5882B8

#C3D5E5 #AEC6DD #9BB8D6 #89AACE #779CC7 #678FBF #5882B8

#C3D5E5 - #89AACE - #5882B8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C3D5E5 0%, #89AACE 50%, #5882B8 100%);
    background: -webkit-linear-gradient(top, #C3D5E5 0%, #89AACE 50%, #5882B8 100%);
    background: linear-gradient(to bottom, #C3D5E5 0%, #89AACE 50%, #5882B8 100%);
}
</style>