#3E3E95 - #7B86C0 | 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 #3E3E95 to #7B86C0

#3E3E95 #7B86C0

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

#3E3E95 - #7B86C0 | 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 #3E3E95 as 0% and #7B86C0 as 100%.

0.0%	0.0% #3E3E95	RGB 62 62 149	#3E3E95
16.7%	16.7% #484A9C	RGB 72 74 156	#484A9C
33.3%	33.3% #5256A3	RGB 82 86 163	#5256A3
50.0%	50.0% #5C62AA	RGB 92 98 170	#5C62AA
66.7%	66.7% #666EB1	RGB 102 110 177	#666EB1
83.3%	83.3% #707AB8	RGB 112 122 184	#707AB8
100.0%	100.0% #7B86C0	RGB 123 134 192	#7B86C0

#3E3E95 #484A9C #5256A3 #5C62AA #666EB1 #707AB8 #7B86C0

#3E3E95 - #7B86C0

HSV Blend

#3E3E95 - #7B86C0 | 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 #3E3E95 as 0% and #7B86C0 as 100%.

0.0%	0.0% #3E3E95	RGB 62 62 149	#3E3E95
16.7%	16.7% #46499C	RGB 70 73 156	#46499C
33.3%	33.3% #5054A3	RGB 80 84 163	#5054A3
50.0%	50.0% #5A60AA	RGB 90 96 170	#5A60AA
66.7%	66.7% #646CB1	RGB 100 108 177	#646CB1
83.3%	83.3% #6F79B8	RGB 111 121 184	#6F79B8
100.0%	100.0% #7B86C0	RGB 123 134 192	#7B86C0

#3E3E95 #46499C #5054A3 #5A60AA #646CB1 #6F79B8 #7B86C0

#3E3E95 - #5A60AA - #7B86C0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3E3E95 0%, #5A60AA 50%, #7B86C0 100%);
    background: -webkit-linear-gradient(top, #3E3E95 0%, #5A60AA 50%, #7B86C0 100%);
    background: linear-gradient(to bottom, #3E3E95 0%, #5A60AA 50%, #7B86C0 100%);
}
</style>