#CCCDD4 - #6F8596 | 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 #CCCDD4 to #6F8596

#CCCDD4 #6F8596

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

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

0.0%	0.0% #CCCDD4	RGB 204 205 212	#CCCDD4
16.7%	16.7% #BCC1C9	RGB 188 193 201	#BCC1C9
33.3%	33.3% #ADB5BF	RGB 173 181 191	#ADB5BF
50.0%	50.0% #9DA9B5	RGB 157 169 181	#9DA9B5
66.7%	66.7% #8E9DAA	RGB 142 157 170	#8E9DAA
83.3%	83.3% #7E91A0	RGB 126 145 160	#7E91A0
100.0%	100.0% #6F8596	RGB 111 133 150	#6F8596

#CCCDD4 #BCC1C9 #ADB5BF #9DA9B5 #8E9DAA #7E91A0 #6F8596

#CCCDD4 - #6F8596

HSV Blend

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

0.0%	0.0% #CCCDD4	RGB 204 205 212	#CCCDD4
16.7%	16.7% #BABDC9	RGB 186 189 201	#BABDC9
33.3%	33.3% #A9AFBF	RGB 169 175 191	#A9AFBF
50.0%	50.0% #9AA3B5	RGB 154 163 181	#9AA3B5
66.7%	66.7% #8A98AA	RGB 138 152 170	#8A98AA
83.3%	83.3% #7C8EA0	RGB 124 142 160	#7C8EA0
100.0%	100.0% #6F8596	RGB 111 133 150	#6F8596

#CCCDD4 #BABDC9 #A9AFBF #9AA3B5 #8A98AA #7C8EA0 #6F8596

#CCCDD4 - #9AA3B5 - #6F8596

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CCCDD4 0%, #9AA3B5 50%, #6F8596 100%);
    background: -webkit-linear-gradient(top, #CCCDD4 0%, #9AA3B5 50%, #6F8596 100%);
    background: linear-gradient(to bottom, #CCCDD4 0%, #9AA3B5 50%, #6F8596 100%);
}
</style>