#CF56C7 - #8686FF | 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 #CF56C7 to #8686FF

#CF56C7 #8686FF

Calculate the color between two colors, #CF56C7 and #8686FF. 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)

#CF56C7 - #8686FF | 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 #CF56C7 as 0% and #8686FF as 100%.

0.0%	0.0% #CF56C7	RGB 207 86 199	#CF56C7
16.7%	16.7% #C25ED0	RGB 194 94 208	#C25ED0
33.3%	33.3% #B666D9	RGB 182 102 217	#B666D9
50.0%	50.0% #AA6EE3	RGB 170 110 227	#AA6EE3
66.7%	66.7% #9E76EC	RGB 158 118 236	#9E76EC
83.3%	83.3% #927EF5	RGB 146 126 245	#927EF5
100.0%	100.0% #8686FF	RGB 134 134 255	#8686FF

#CF56C7 #C25ED0 #B666D9 #AA6EE3 #9E76EC #927EF5 #8686FF

#CF56C7 - #8686FF

HSV Blend

#CF56C7 - #8686FF | 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 #CF56C7 as 0% and #8686FF as 100%.

0.0%	0.0% #CF56C7	RGB 207 86 199	#CF56C7
16.7%	16.7% #C95DD7	RGB 201 93 215	#C95DD7
33.3%	33.3% #BB64DF	RGB 187 100 223	#BB64DF
50.0%	50.0% #AD6CE7	RGB 173 108 231	#AD6CE7
66.7%	66.7% #A074EF	RGB 160 116 239	#A074EF
83.3%	83.3% #927DF7	RGB 146 125 247	#927DF7
100.0%	100.0% #8686FF	RGB 134 134 255	#8686FF

#CF56C7 #C95DD7 #BB64DF #AD6CE7 #A074EF #927DF7 #8686FF

#CF56C7 - #AD6CE7 - #8686FF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CF56C7 0%, #AD6CE7 50%, #8686FF 100%);
    background: -webkit-linear-gradient(top, #CF56C7 0%, #AD6CE7 50%, #8686FF 100%);
    background: linear-gradient(to bottom, #CF56C7 0%, #AD6CE7 50%, #8686FF 100%);
}
</style>