#4F5E4D - #7486E4 | 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 #4F5E4D to #7486E4

#4F5E4D #7486E4

Calculate the color between two colors, #4F5E4D and #7486E4. 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)

#4F5E4D - #7486E4 | 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 #4F5E4D as 0% and #7486E4 as 100%.

0.0%	0.0% #4F5E4D	RGB 79 94 77	#4F5E4D
16.7%	16.7% #556466	RGB 85 100 102	#556466
33.3%	33.3% #5B6B7F	RGB 91 107 127	#5B6B7F
50.0%	50.0% #617298	RGB 97 114 152	#617298
66.7%	66.7% #6778B1	RGB 103 120 177	#6778B1
83.3%	83.3% #6D7FCA	RGB 109 127 202	#6D7FCA
100.0%	100.0% #7486E4	RGB 116 134 228	#7486E4

#4F5E4D #556466 #5B6B7F #617298 #6778B1 #6D7FCA #7486E4

#4F5E4D - #7486E4

HSV Blend

#4F5E4D - #7486E4 | 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 #4F5E4D as 0% and #7486E4 as 100%.

0.0%	0.0% #4F5E4D	RGB 79 94 77	#4F5E4D
16.7%	16.7% #59745E	RGB 89 116 94	#59745E
33.3%	33.3% #638A78	RGB 99 138 120	#638A78
50.0%	50.0% #6AA199	RGB 106 161 153	#6AA199
66.7%	66.7% #70AAB7	RGB 112 170 183	#70AAB7
83.3%	83.3% #739FCD	RGB 115 159 205	#739FCD
100.0%	100.0% #7486E4	RGB 116 134 228	#7486E4

#4F5E4D #59745E #638A78 #6AA199 #70AAB7 #739FCD #7486E4

#4F5E4D - #6AA199 - #7486E4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4F5E4D 0%, #6AA199 50%, #7486E4 100%);
    background: -webkit-linear-gradient(top, #4F5E4D 0%, #6AA199 50%, #7486E4 100%);
    background: linear-gradient(to bottom, #4F5E4D 0%, #6AA199 50%, #7486E4 100%);
}
</style>