#3C3CBA - #6C8BE7 | 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 #3C3CBA to #6C8BE7

#3C3CBA #6C8BE7

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

#3C3CBA - #6C8BE7 | 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 #3C3CBA as 0% and #6C8BE7 as 100%.

0.0%	0.0% #3C3CBA	RGB 60 60 186	#3C3CBA
16.7%	16.7% #4449C1	RGB 68 73 193	#4449C1
33.3%	33.3% #4C56C9	RGB 76 86 201	#4C56C9
50.0%	50.0% #5463D0	RGB 84 99 208	#5463D0
66.7%	66.7% #5C70D8	RGB 92 112 216	#5C70D8
83.3%	83.3% #647DDF	RGB 100 125 223	#647DDF
100.0%	100.0% #6C8BE7	RGB 108 139 231	#6C8BE7

#3C3CBA #4449C1 #4C56C9 #5463D0 #5C70D8 #647DDF #6C8BE7

#3C3CBA - #6C8BE7

HSV Blend

#3C3CBA - #6C8BE7 | 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 #3C3CBA as 0% and #6C8BE7 as 100%.

0.0%	0.0% #3C3CBA	RGB 60 60 186	#3C3CBA
16.7%	16.7% #4348C1	RGB 67 72 193	#4348C1
33.3%	33.3% #4A55C9	RGB 74 85 201	#4A55C9
50.0%	50.0% #5262D0	RGB 82 98 208	#5262D0
66.7%	66.7% #5A6FD8	RGB 90 111 216	#5A6FD8
83.3%	83.3% #637DDF	RGB 99 125 223	#637DDF
100.0%	100.0% #6C8BE7	RGB 108 139 231	#6C8BE7

#3C3CBA #4348C1 #4A55C9 #5262D0 #5A6FD8 #637DDF #6C8BE7

#3C3CBA - #5262D0 - #6C8BE7

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C3CBA 0%, #5262D0 50%, #6C8BE7 100%);
    background: -webkit-linear-gradient(top, #3C3CBA 0%, #5262D0 50%, #6C8BE7 100%);
    background: linear-gradient(to bottom, #3C3CBA 0%, #5262D0 50%, #6C8BE7 100%);
}
</style>