#9771FF - #4700C4 | 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 #9771FF to #4700C4

#9771FF #4700C4

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

#9771FF - #4700C4 | 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 #9771FF as 0% and #4700C4 as 100%.

0.0%	0.0% #9771FF	RGB 151 113 255	#9771FF
16.7%	16.7% #895EF5	RGB 137 94 245	#895EF5
33.3%	33.3% #7C4BEB	RGB 124 75 235	#7C4BEB
50.0%	50.0% #6F38E1	RGB 111 56 225	#6F38E1
66.7%	66.7% #6125D7	RGB 97 37 215	#6125D7
83.3%	83.3% #5412CD	RGB 84 18 205	#5412CD
100.0%	100.0% #4700C4	RGB 71 0 196	#4700C4

#9771FF #895EF5 #7C4BEB #6F38E1 #6125D7 #5412CD #4700C4

#9771FF - #4700C4

HSV Blend

#9771FF - #4700C4 | 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 #9771FF as 0% and #4700C4 as 100%.

0.0%	0.0% #9671FF	RGB 150 113 255	#9671FF
16.7%	16.7% #865AF5	RGB 134 90 245	#865AF5
33.3%	33.3% #7745EB	RGB 119 69 235	#7745EB
50.0%	50.0% #6931E1	RGB 105 49 225	#6931E1
66.7%	66.7% #5C1FD7	RGB 92 31 215	#5C1FD7
83.3%	83.3% #510FCD	RGB 81 15 205	#510FCD
100.0%	100.0% #4700C4	RGB 71 0 196	#4700C4

#9671FF #865AF5 #7745EB #6931E1 #5C1FD7 #510FCD #4700C4

#9771FF - #6931E1 - #4700C4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #9671FF 0%, #6931E1 50%, #4700C4 100%);
    background: -webkit-linear-gradient(top, #9671FF 0%, #6931E1 50%, #4700C4 100%);
    background: linear-gradient(to bottom, #9671FF 0%, #6931E1 50%, #4700C4 100%);
}
</style>