#CCE3E7 - #70AFB0 | 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 #CCE3E7 to #70AFB0

#CCE3E7 #70AFB0

Calculate the color between two colors, #CCE3E7 and #70AFB0. 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)

#CCE3E7 - #70AFB0 | 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 #CCE3E7 as 0% and #70AFB0 as 100%.

0.0%	0.0% #CCE3E7	RGB 204 227 231	#CCE3E7
16.7%	16.7% #BCDADD	RGB 188 218 221	#BCDADD
33.3%	33.3% #ADD1D4	RGB 173 209 212	#ADD1D4
50.0%	50.0% #9EC9CB	RGB 158 201 203	#9EC9CB
66.7%	66.7% #8EC0C2	RGB 142 192 194	#8EC0C2
83.3%	83.3% #7FB7B9	RGB 127 183 185	#7FB7B9
100.0%	100.0% #70AFB0	RGB 112 175 176	#70AFB0

#CCE3E7 #BCDADD #ADD1D4 #9EC9CB #8EC0C2 #7FB7B9 #70AFB0

#CCE3E7 - #70AFB0

HSV Blend

#CCE3E7 - #70AFB0 | 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 #CCE3E7 as 0% and #70AFB0 as 100%.

0.0%	0.0% #CCE3E7	RGB 204 227 231	#CCE3E7
16.7%	16.7% #BAD9DD	RGB 186 217 221	#BAD9DD
33.3%	33.3% #AAD0D4	RGB 170 208 212	#AAD0D4
50.0%	50.0% #9AC7CB	RGB 154 199 203	#9AC7CB
66.7%	66.7% #8BBFC2	RGB 139 191 194	#8BBFC2
83.3%	83.3% #7DB6B9	RGB 125 182 185	#7DB6B9
100.0%	100.0% #70AFB0	RGB 112 175 176	#70AFB0

#CCE3E7 #BAD9DD #AAD0D4 #9AC7CB #8BBFC2 #7DB6B9 #70AFB0

#CCE3E7 - #9AC7CB - #70AFB0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CCE3E7 0%, #9AC7CB 50%, #70AFB0 100%);
    background: -webkit-linear-gradient(top, #CCE3E7 0%, #9AC7CB 50%, #70AFB0 100%);
    background: linear-gradient(to bottom, #CCE3E7 0%, #9AC7CB 50%, #70AFB0 100%);
}
</style>