#CDCDFC - #677DCF | 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 #CDCDFC to #677DCF

#CDCDFC #677DCF

Calculate the color between two colors, #CDCDFC and #677DCF. 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)

#CDCDFC - #677DCF | 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 #CDCDFC as 0% and #677DCF as 100%.

0.0%	0.0% #CDCDFC	RGB 205 205 252	#CDCDFC
16.7%	16.7% #BCBFF4	RGB 188 191 244	#BCBFF4
33.3%	33.3% #ABB2ED	RGB 171 178 237	#ABB2ED
50.0%	50.0% #9AA5E5	RGB 154 165 229	#9AA5E5
66.7%	66.7% #8997DE	RGB 137 151 222	#8997DE
83.3%	83.3% #788AD6	RGB 120 138 214	#788AD6
100.0%	100.0% #677DCF	RGB 103 125 207	#677DCF

#CDCDFC #BCBFF4 #ABB2ED #9AA5E5 #8997DE #788AD6 #677DCF

#CDCDFC - #677DCF

HSV Blend

#CDCDFC - #677DCF | 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 #CDCDFC as 0% and #677DCF as 100%.

0.0%	0.0% #CDCDFC	RGB 205 205 252	#CDCDFC
16.7%	16.7% #BABCF4	RGB 186 188 244	#BABCF4
33.3%	33.3% #A7ACED	RGB 167 172 237	#A7ACED
50.0%	50.0% #969EE5	RGB 150 158 229	#969EE5
66.7%	66.7% #8592DE	RGB 133 146 222	#8592DE
83.3%	83.3% #7687D6	RGB 118 135 214	#7687D6
100.0%	100.0% #677DCF	RGB 103 125 207	#677DCF

#CDCDFC #BABCF4 #A7ACED #969EE5 #8592DE #7687D6 #677DCF

#CDCDFC - #969EE5 - #677DCF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CDCDFC 0%, #969EE5 50%, #677DCF 100%);
    background: -webkit-linear-gradient(top, #CDCDFC 0%, #969EE5 50%, #677DCF 100%);
    background: linear-gradient(to bottom, #CDCDFC 0%, #969EE5 50%, #677DCF 100%);
}
</style>