#CDCDF6 - #687FC6 | 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 #CDCDF6 to #687FC6

#CDCDF6 #687FC6

Calculate the color between two colors, #CDCDF6 and #687FC6. 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)

#CDCDF6 - #687FC6 | 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 #CDCDF6 as 0% and #687FC6 as 100%.

0.0%	0.0% #CDCDF6	RGB 205 205 246	#CDCDF6
16.7%	16.7% #BCC0EE	RGB 188 192 238	#BCC0EE
33.3%	33.3% #ABB3E6	RGB 171 179 230	#ABB3E6
50.0%	50.0% #9AA6DE	RGB 154 166 222	#9AA6DE
66.7%	66.7% #8999D6	RGB 137 153 214	#8999D6
83.3%	83.3% #788CCE	RGB 120 140 206	#788CCE
100.0%	100.0% #687FC6	RGB 104 127 198	#687FC6

#CDCDF6 #BCC0EE #ABB3E6 #9AA6DE #8999D6 #788CCE #687FC6

#CDCDF6 - #687FC6

HSV Blend

#CDCDF6 - #687FC6 | 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 #CDCDF6 as 0% and #687FC6 as 100%.

0.0%	0.0% #CDCDF6	RGB 205 205 246	#CDCDF6
16.7%	16.7% #BABCEE	RGB 186 188 238	#BABCEE
33.3%	33.3% #A8ADE6	RGB 168 173 230	#A8ADE6
50.0%	50.0% #969FDE	RGB 150 159 222	#969FDE
66.7%	66.7% #8693D6	RGB 134 147 214	#8693D6
83.3%	83.3% #7688CE	RGB 118 136 206	#7688CE
100.0%	100.0% #687FC6	RGB 104 127 198	#687FC6

#CDCDF6 #BABCEE #A8ADE6 #969FDE #8693D6 #7688CE #687FC6

#CDCDF6 - #969FDE - #687FC6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CDCDF6 0%, #969FDE 50%, #687FC6 100%);
    background: -webkit-linear-gradient(top, #CDCDF6 0%, #969FDE 50%, #687FC6 100%);
    background: linear-gradient(to bottom, #CDCDF6 0%, #969FDE 50%, #687FC6 100%);
}
</style>