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

#C8C8DC #677EA0

Calculate the color between two colors, #C8C8DC 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)

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

0.0%	0.0% #C8C8DC	RGB 200 200 220	#C8C8DC
16.7%	16.7% #B7BBD2	RGB 183 187 210	#B7BBD2
33.3%	33.3% #A7AFC8	RGB 167 175 200	#A7AFC8
50.0%	50.0% #97A3BE	RGB 151 163 190	#97A3BE
66.7%	66.7% #8796B4	RGB 135 150 180	#8796B4
83.3%	83.3% #778AAA	RGB 119 138 170	#778AAA
100.0%	100.0% #677EA0	RGB 103 126 160	#677EA0

#C8C8DC #B7BBD2 #A7AFC8 #97A3BE #8796B4 #778AAA #677EA0

#C8C8DC - #677EA0

HSV Blend

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

0.0%	0.0% #C8C8DC	RGB 200 200 220	#C8C8DC
16.7%	16.7% #B5B7D2	RGB 181 183 210	#B5B7D2
33.3%	33.3% #A4A8C8	RGB 164 168 200	#A4A8C8
50.0%	50.0% #939CBE	RGB 147 156 190	#939CBE
66.7%	66.7% #8390B4	RGB 131 144 180	#8390B4
83.3%	83.3% #7486AA	RGB 116 134 170	#7486AA
100.0%	100.0% #677EA0	RGB 103 126 160	#677EA0

#C8C8DC #B5B7D2 #A4A8C8 #939CBE #8390B4 #7486AA #677EA0

#C8C8DC - #939CBE - #677EA0

CSS codes

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

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