#CCD9F1 - #708FBF | 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 #CCD9F1 to #708FBF

#CCD9F1 #708FBF

Calculate the color between two colors, #CCD9F1 and #708FBF. 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)

#CCD9F1 - #708FBF | 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 #CCD9F1 as 0% and #708FBF as 100%.

0.0%	0.0% #CCD9F1	RGB 204 217 241	#CCD9F1
16.7%	16.7% #BCCCE8	RGB 188 204 232	#BCCCE8
33.3%	33.3% #ADC0E0	RGB 173 192 224	#ADC0E0
50.0%	50.0% #9EB4D8	RGB 158 180 216	#9EB4D8
66.7%	66.7% #8EA7CF	RGB 142 167 207	#8EA7CF
83.3%	83.3% #7F9BC7	RGB 127 155 199	#7F9BC7
100.0%	100.0% #708FBF	RGB 112 143 191	#708FBF

#CCD9F1 #BCCCE8 #ADC0E0 #9EB4D8 #8EA7CF #7F9BC7 #708FBF

#CCD9F1 - #708FBF

HSV Blend

#CCD9F1 - #708FBF | 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 #CCD9F1 as 0% and #708FBF as 100%.

0.0%	0.0% #CCD9F1	RGB 204 217 241	#CCD9F1
16.7%	16.7% #BACBE8	RGB 186 203 232	#BACBE8
33.3%	33.3% #AABEE0	RGB 170 190 224	#AABEE0
50.0%	50.0% #9AB1D8	RGB 154 177 216	#9AB1D8
66.7%	66.7% #8BA5CF	RGB 139 165 207	#8BA5CF
83.3%	83.3% #7D99C7	RGB 125 153 199	#7D99C7
100.0%	100.0% #708FBF	RGB 112 143 191	#708FBF

#CCD9F1 #BACBE8 #AABEE0 #9AB1D8 #8BA5CF #7D99C7 #708FBF

#CCD9F1 - #9AB1D8 - #708FBF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CCD9F1 0%, #9AB1D8 50%, #708FBF 100%);
    background: -webkit-linear-gradient(top, #CCD9F1 0%, #9AB1D8 50%, #708FBF 100%);
    background: linear-gradient(to bottom, #CCD9F1 0%, #9AB1D8 50%, #708FBF 100%);
}
</style>