#C3CADB - #677EA0 | 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 #C3CADB to #677EA0

#C3CADB #677EA0

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

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

0.0%	0.0% #C3CADB	RGB 195 202 219	#C3CADB
16.7%	16.7% #B3BDD1	RGB 179 189 209	#B3BDD1
33.3%	33.3% #A4B0C7	RGB 164 176 199	#A4B0C7
50.0%	50.0% #95A4BD	RGB 149 164 189	#95A4BD
66.7%	66.7% #8597B3	RGB 133 151 179	#8597B3
83.3%	83.3% #768AA9	RGB 118 138 169	#768AA9
100.0%	100.0% #677EA0	RGB 103 126 160	#677EA0

#C3CADB #B3BDD1 #A4B0C7 #95A4BD #8597B3 #768AA9 #677EA0

#C3CADB - #677EA0

HSV Blend

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

0.0%	0.0% #C3CADB	RGB 195 202 219	#C3CADB
16.7%	16.7% #B1BBD1	RGB 177 187 209	#B1BBD1
33.3%	33.3% #A1ADC7	RGB 161 173 199	#A1ADC7
50.0%	50.0% #91A0BD	RGB 145 160 189	#91A0BD
66.7%	66.7% #8294B3	RGB 130 148 179	#8294B3
83.3%	83.3% #7488A9	RGB 116 136 169	#7488A9
100.0%	100.0% #677EA0	RGB 103 126 160	#677EA0

#C3CADB #B1BBD1 #A1ADC7 #91A0BD #8294B3 #7488A9 #677EA0

#C3CADB - #91A0BD - #677EA0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C3CADB 0%, #91A0BD 50%, #677EA0 100%);
    background: -webkit-linear-gradient(top, #C3CADB 0%, #91A0BD 50%, #677EA0 100%);
    background: linear-gradient(to bottom, #C3CADB 0%, #91A0BD 50%, #677EA0 100%);
}
</style>