#CDCDF9 - #687ECB | 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 #CDCDF9 to #687ECB

#CDCDF9 #687ECB

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

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

0.0%	0.0% #CDCDF9	RGB 205 205 249	#CDCDF9
16.7%	16.7% #BCBFF1	RGB 188 191 241	#BCBFF1
33.3%	33.3% #ABB2E9	RGB 171 178 233	#ABB2E9
50.0%	50.0% #9AA5E2	RGB 154 165 226	#9AA5E2
66.7%	66.7% #8998DA	RGB 137 152 218	#8998DA
83.3%	83.3% #788BD2	RGB 120 139 210	#788BD2
100.0%	100.0% #687ECB	RGB 104 126 203	#687ECB

#CDCDF9 #BCBFF1 #ABB2E9 #9AA5E2 #8998DA #788BD2 #687ECB

#CDCDF9 - #687ECB

HSV Blend

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

0.0%	0.0% #CDCDF9	RGB 205 205 249	#CDCDF9
16.7%	16.7% #BABCF1	RGB 186 188 241	#BABCF1
33.3%	33.3% #A8ADE9	RGB 168 173 233	#A8ADE9
50.0%	50.0% #969FE2	RGB 150 159 226	#969FE2
66.7%	66.7% #8692DA	RGB 134 146 218	#8692DA
83.3%	83.3% #7687D2	RGB 118 135 210	#7687D2
100.0%	100.0% #687ECB	RGB 104 126 203	#687ECB

#CDCDF9 #BABCF1 #A8ADE9 #969FE2 #8692DA #7687D2 #687ECB

#CDCDF9 - #969FE2 - #687ECB

CSS codes

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

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