#3C3FAC - #C7C7E7 | 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 #3C3FAC to #C7C7E7

#3C3FAC #C7C7E7

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

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

0.0%	0.0% #3C3FAC	RGB 60 63 172	#3C3FAC
16.7%	16.7% #5355B5	RGB 83 85 181	#5355B5
33.3%	33.3% #6A6CBF	RGB 106 108 191	#6A6CBF
50.0%	50.0% #8183C9	RGB 129 131 201	#8183C9
66.7%	66.7% #9899D3	RGB 152 153 211	#9899D3
83.3%	83.3% #AFB0DD	RGB 175 176 221	#AFB0DD
100.0%	100.0% #C7C7E7	RGB 199 199 231	#C7C7E7

#3C3FAC #5355B5 #6A6CBF #8183C9 #9899D3 #AFB0DD #C7C7E7

#3C3FAC - #C7C7E7

HSV Blend

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

0.0%	0.0% #3C3FAC	RGB 60 63 172	#3C3FAC
16.7%	16.7% #4E51B5	RGB 78 81 181	#4E51B5
33.3%	33.3% #6365BF	RGB 99 101 191	#6365BF
50.0%	50.0% #797BC9	RGB 121 123 201	#797BC9
66.7%	66.7% #9192D3	RGB 145 146 211	#9192D3
83.3%	83.3% #ABABDD	RGB 171 171 221	#ABABDD
100.0%	100.0% #C7C7E7	RGB 199 199 231	#C7C7E7

#3C3FAC #4E51B5 #6365BF #797BC9 #9192D3 #ABABDD #C7C7E7

#3C3FAC - #797BC9 - #C7C7E7

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C3FAC 0%, #797BC9 50%, #C7C7E7 100%);
    background: -webkit-linear-gradient(top, #3C3FAC 0%, #797BC9 50%, #C7C7E7 100%);
    background: linear-gradient(to bottom, #3C3FAC 0%, #797BC9 50%, #C7C7E7 100%);
}
</style>