#C678FF - #8701C7 | 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 #C678FF to #8701C7

#C678FF #8701C7

Calculate the color between two colors, #C678FF and #8701C7. 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)

#C678FF - #8701C7 | 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 #C678FF as 0% and #8701C7 as 100%.

0.0%	0.0% #C678FF	RGB 198 120 255	#C678FF
16.7%	16.7% #BB64F5	RGB 187 100 245	#BB64F5
33.3%	33.3% #B150EC	RGB 177 80 236	#B150EC
50.0%	50.0% #A63CE3	RGB 166 60 227	#A63CE3
66.7%	66.7% #9C28D9	RGB 156 40 217	#9C28D9
83.3%	83.3% #9114D0	RGB 145 20 208	#9114D0
100.0%	100.0% #8701C7	RGB 135 1 199	#8701C7

#C678FF #BB64F5 #B150EC #A63CE3 #9C28D9 #9114D0 #8701C7

#C678FF - #8701C7

HSV Blend

#C678FF - #8701C7 | 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 #C678FF as 0% and #8701C7 as 100%.

0.0%	0.0% #C678FF	RGB 198 120 255	#C678FF
16.7%	16.7% #B960F5	RGB 185 96 245	#B960F5
33.3%	33.3% #AD4AEC	RGB 173 74 236	#AD4AEC
50.0%	50.0% #A235E3	RGB 162 53 227	#A235E3
66.7%	66.7% #9822D9	RGB 152 34 217	#9822D9
83.3%	83.3% #8F11D0	RGB 143 17 208	#8F11D0
100.0%	100.0% #8701C7	RGB 135 1 199	#8701C7

#C678FF #B960F5 #AD4AEC #A235E3 #9822D9 #8F11D0 #8701C7

#C678FF - #A235E3 - #8701C7

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C678FF 0%, #A235E3 50%, #8701C7 100%);
    background: -webkit-linear-gradient(top, #C678FF 0%, #A235E3 50%, #8701C7 100%);
    background: linear-gradient(to bottom, #C678FF 0%, #A235E3 50%, #8701C7 100%);
}
</style>