#8F6CC4 - #8CC0FF | 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 #8F6CC4 to #8CC0FF

#8F6CC4 #8CC0FF

Calculate the color between two colors, #8F6CC4 and #8CC0FF. 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)

#8F6CC4 - #8CC0FF | 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 #8F6CC4 as 0% and #8CC0FF as 100%.

0.0%	0.0% #8F6CC4	RGB 143 108 196	#8F6CC4
16.7%	16.7% #8E7ACD	RGB 142 122 205	#8E7ACD
33.3%	33.3% #8E88D7	RGB 142 136 215	#8E88D7
50.0%	50.0% #8D96E1	RGB 141 150 225	#8D96E1
66.7%	66.7% #8DA4EB	RGB 141 164 235	#8DA4EB
83.3%	83.3% #8CB2F5	RGB 140 178 245	#8CB2F5
100.0%	100.0% #8CC0FF	RGB 140 192 255	#8CC0FF

#8F6CC4 #8E7ACD #8E88D7 #8D96E1 #8DA4EB #8CB2F5 #8CC0FF

#8F6CC4 - #8CC0FF

HSV Blend

#8F6CC4 - #8CC0FF | 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 #8F6CC4 as 0% and #8CC0FF as 100%.

0.0%	0.0% #8F6CC4	RGB 143 108 196	#8F6CC4
16.7%	16.7% #8971CD	RGB 137 113 205	#8971CD
33.3%	33.3% #8176D7	RGB 129 118 215	#8176D7
50.0%	50.0% #7C7EE1	RGB 124 126 225	#7C7EE1
66.7%	66.7% #8193EB	RGB 129 147 235	#8193EB
83.3%	83.3% #86A8F5	RGB 134 168 245	#86A8F5
100.0%	100.0% #8CC0FF	RGB 140 192 255	#8CC0FF

#8F6CC4 #8971CD #8176D7 #7C7EE1 #8193EB #86A8F5 #8CC0FF

#8F6CC4 - #7C7EE1 - #8CC0FF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8F6CC4 0%, #7C7EE1 50%, #8CC0FF 100%);
    background: -webkit-linear-gradient(top, #8F6CC4 0%, #7C7EE1 50%, #8CC0FF 100%);
    background: linear-gradient(to bottom, #8F6CC4 0%, #7C7EE1 50%, #8CC0FF 100%);
}
</style>