#CCD3E6 - #7089AF | 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 #CCD3E6 to #7089AF

#CCD3E6 #7089AF

Calculate the color between two colors, #CCD3E6 and #7089AF. 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)

#CCD3E6 - #7089AF | 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 #CCD3E6 as 0% and #7089AF as 100%.

0.0%	0.0% #CCD3E6	RGB 204 211 230	#CCD3E6
16.7%	16.7% #BCC6DC	RGB 188 198 220	#BCC6DC
33.3%	33.3% #ADBAD3	RGB 173 186 211	#ADBAD3
50.0%	50.0% #9EAECA	RGB 158 174 202	#9EAECA
66.7%	66.7% #8EA1C1	RGB 142 161 193	#8EA1C1
83.3%	83.3% #7F95B8	RGB 127 149 184	#7F95B8
100.0%	100.0% #7089AF	RGB 112 137 175	#7089AF

#CCD3E6 #BCC6DC #ADBAD3 #9EAECA #8EA1C1 #7F95B8 #7089AF

#CCD3E6 - #7089AF

HSV Blend

#CCD3E6 - #7089AF | 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 #CCD3E6 as 0% and #7089AF as 100%.

0.0%	0.0% #CCD3E6	RGB 204 211 230	#CCD3E6
16.7%	16.7% #BAC4DC	RGB 186 196 220	#BAC4DC
33.3%	33.3% #AAB7D3	RGB 170 183 211	#AAB7D3
50.0%	50.0% #9AAACA	RGB 154 170 202	#9AAACA
66.7%	66.7% #8B9EC1	RGB 139 158 193	#8B9EC1
83.3%	83.3% #7D93B8	RGB 125 147 184	#7D93B8
100.0%	100.0% #7089AF	RGB 112 137 175	#7089AF

#CCD3E6 #BAC4DC #AAB7D3 #9AAACA #8B9EC1 #7D93B8 #7089AF

#CCD3E6 - #9AAACA - #7089AF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CCD3E6 0%, #9AAACA 50%, #7089AF 100%);
    background: -webkit-linear-gradient(top, #CCD3E6 0%, #9AAACA 50%, #7089AF 100%);
    background: linear-gradient(to bottom, #CCD3E6 0%, #9AAACA 50%, #7089AF 100%);
}
</style>