#CCCCCD - #6D878D | 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 #CCCCCD to #6D878D

#CCCCCD #6D878D

Calculate the color between two colors, #CCCCCD and #6D878D. 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)

#CCCCCD - #6D878D | 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 #CCCCCD as 0% and #6D878D as 100%.

0.0%	0.0% #CCCCCD	RGB 204 204 205	#CCCCCD
16.7%	16.7% #BCC0C2	RGB 188 192 194	#BCC0C2
33.3%	33.3% #ACB5B7	RGB 172 181 183	#ACB5B7
50.0%	50.0% #9CA9AD	RGB 156 169 173	#9CA9AD
66.7%	66.7% #8C9EA2	RGB 140 158 162	#8C9EA2
83.3%	83.3% #7C9297	RGB 124 146 151	#7C9297
100.0%	100.0% #6D878D	RGB 109 135 141	#6D878D

#CCCCCD #BCC0C2 #ACB5B7 #9CA9AD #8C9EA2 #7C9297 #6D878D

#CCCCCD - #6D878D

HSV Blend

#CCCCCD - #6D878D | 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 #CCCCCD as 0% and #6D878D as 100%.

0.0%	0.0% #CCCCCD	RGB 204 204 205	#CCCCCD
16.7%	16.7% #BABBC2	RGB 186 187 194	#BABBC2
33.3%	33.3% #A9ADB7	RGB 169 173 183	#A9ADB7
50.0%	50.0% #98A1AD	RGB 152 161 173	#98A1AD
66.7%	66.7% #8996A2	RGB 137 150 162	#8996A2
83.3%	83.3% #7A8E97	RGB 122 142 151	#7A8E97
100.0%	100.0% #6D878D	RGB 109 135 141	#6D878D

#CCCCCD #BABBC2 #A9ADB7 #98A1AD #8996A2 #7A8E97 #6D878D

#CCCCCD - #98A1AD - #6D878D

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CCCCCD 0%, #98A1AD 50%, #6D878D 100%);
    background: -webkit-linear-gradient(top, #CCCCCD 0%, #98A1AD 50%, #6D878D 100%);
    background: linear-gradient(to bottom, #CCCCCD 0%, #98A1AD 50%, #6D878D 100%);
}
</style>