#3F5C8C - #8C79E9 | 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 #3F5C8C to #8C79E9

#3F5C8C #8C79E9

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

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

0.0%	0.0% #3F5C8C	RGB 63 92 140	#3F5C8C
16.7%	16.7% #4B609B	RGB 75 96 155	#4B609B
33.3%	33.3% #5865AB	RGB 88 101 171	#5865AB
50.0%	50.0% #656ABA	RGB 101 106 186	#656ABA
66.7%	66.7% #726FCA	RGB 114 111 202	#726FCA
83.3%	83.3% #7F74D9	RGB 127 116 217	#7F74D9
100.0%	100.0% #8C79E9	RGB 140 121 233	#8C79E9

#3F5C8C #4B609B #5865AB #656ABA #726FCA #7F74D9 #8C79E9

#3F5C8C - #8C79E9

HSV Blend

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

0.0%	0.0% #3F5C8C	RGB 63 92 140	#3F5C8C
16.7%	16.7% #475F9B	RGB 71 95 155	#475F9B
33.3%	33.3% #5062AB	RGB 80 98 171	#5062AB
50.0%	50.0% #5A64BA	RGB 90 100 186	#5A64BA
66.7%	66.7% #6465CA	RGB 100 101 202	#6465CA
83.3%	83.3% #766ED9	RGB 118 110 217	#766ED9
100.0%	100.0% #8C79E9	RGB 140 121 233	#8C79E9

#3F5C8C #475F9B #5062AB #5A64BA #6465CA #766ED9 #8C79E9

#3F5C8C - #5A64BA - #8C79E9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3F5C8C 0%, #5A64BA 50%, #8C79E9 100%);
    background: -webkit-linear-gradient(top, #3F5C8C 0%, #5A64BA 50%, #8C79E9 100%);
    background: linear-gradient(to bottom, #3F5C8C 0%, #5A64BA 50%, #8C79E9 100%);
}
</style>