#4D50C2 - #849DE4 | 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 #4D50C2 to #849DE4

#4D50C2 #849DE4

Calculate the color between two colors, #4D50C2 and #849DE4. 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)

#4D50C2 - #849DE4 | 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 #4D50C2 as 0% and #849DE4 as 100%.

0.0%	0.0% #4D50C2	RGB 77 80 194	#4D50C2
16.7%	16.7% #565CC7	RGB 86 92 199	#565CC7
33.3%	33.3% #5F69CD	RGB 95 105 205	#5F69CD
50.0%	50.0% #6876D3	RGB 104 118 211	#6876D3
66.7%	66.7% #7183D8	RGB 113 131 216	#7183D8
83.3%	83.3% #7A90DE	RGB 122 144 222	#7A90DE
100.0%	100.0% #849DE4	RGB 132 157 228	#849DE4

#4D50C2 #565CC7 #5F69CD #6876D3 #7183D8 #7A90DE #849DE4

#4D50C2 - #849DE4

HSV Blend

#4D50C2 - #849DE4 | 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 #4D50C2 as 0% and #849DE4 as 100%.

0.0%	0.0% #4D50C2	RGB 77 80 194	#4D50C2
16.7%	16.7% #555CC7	RGB 85 92 199	#555CC7
33.3%	33.3% #5D69CD	RGB 93 105 205	#5D69CD
50.0%	50.0% #6676D3	RGB 102 118 211	#6676D3
66.7%	66.7% #7083D8	RGB 112 131 216	#7083D8
83.3%	83.3% #7990DE	RGB 121 144 222	#7990DE
100.0%	100.0% #849DE4	RGB 132 157 228	#849DE4

#4D50C2 #555CC7 #5D69CD #6676D3 #7083D8 #7990DE #849DE4

#4D50C2 - #6676D3 - #849DE4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4D50C2 0%, #6676D3 50%, #849DE4 100%);
    background: -webkit-linear-gradient(top, #4D50C2 0%, #6676D3 50%, #849DE4 100%);
    background: linear-gradient(to bottom, #4D50C2 0%, #6676D3 50%, #849DE4 100%);
}
</style>