#8D9EC2 - #3F4B7E | 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 #8D9EC2 to #3F4B7E

#8D9EC2 #3F4B7E

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

#8D9EC2 - #3F4B7E | 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 #8D9EC2 as 0% and #3F4B7E as 100%.

0.0%	0.0% #8D9EC2	RGB 141 158 194	#8D9EC2
16.7%	16.7% #8090B6	RGB 128 144 182	#8090B6
33.3%	33.3% #7382AB	RGB 115 130 171	#7382AB
50.0%	50.0% #6674A0	RGB 102 116 160	#6674A0
66.7%	66.7% #596694	RGB 89 102 148	#596694
83.3%	83.3% #4C5889	RGB 76 88 137	#4C5889
100.0%	100.0% #3F4B7E	RGB 63 75 126	#3F4B7E

#8D9EC2 #8090B6 #7382AB #6674A0 #596694 #4C5889 #3F4B7E

#8D9EC2 - #3F4B7E

HSV Blend

#8D9EC2 - #3F4B7E | 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 #8D9EC2 as 0% and #3F4B7E as 100%.

0.0%	0.0% #8D9EC2	RGB 141 158 194	#8D9EC2
16.7%	16.7% #7D8EB6	RGB 125 142 182	#7D8EB6
33.3%	33.3% #6F80AB	RGB 111 128 171	#6F80AB
50.0%	50.0% #6271A0	RGB 98 113 160	#6271A0
66.7%	66.7% #556494	RGB 85 100 148	#556494
83.3%	83.3% #495789	RGB 73 87 137	#495789
100.0%	100.0% #3F4B7E	RGB 63 75 126	#3F4B7E

#8D9EC2 #7D8EB6 #6F80AB #6271A0 #556494 #495789 #3F4B7E

#8D9EC2 - #6271A0 - #3F4B7E

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8D9EC2 0%, #6271A0 50%, #3F4B7E 100%);
    background: -webkit-linear-gradient(top, #8D9EC2 0%, #6271A0 50%, #3F4B7E 100%);
    background: linear-gradient(to bottom, #8D9EC2 0%, #6271A0 50%, #3F4B7E 100%);
}
</style>