#3C4A8C - #C7CBDE | 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 #3C4A8C to #C7CBDE

#3C4A8C #C7CBDE

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

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

0.0%	0.0% #3C4A8C	RGB 60 74 140	#3C4A8C
16.7%	16.7% #535F99	RGB 83 95 153	#535F99
33.3%	33.3% #6A75A7	RGB 106 117 167	#6A75A7
50.0%	50.0% #818AB5	RGB 129 138 181	#818AB5
66.7%	66.7% #98A0C2	RGB 152 160 194	#98A0C2
83.3%	83.3% #AFB5D0	RGB 175 181 208	#AFB5D0
100.0%	100.0% #C7CBDE	RGB 199 203 222	#C7CBDE

#3C4A8C #535F99 #6A75A7 #818AB5 #98A0C2 #AFB5D0 #C7CBDE

#3C4A8C - #C7CBDE

HSV Blend

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

0.0%	0.0% #3C4A8C	RGB 60 74 140	#3C4A8C
16.7%	16.7% #4D5B99	RGB 77 91 153	#4D5B99
33.3%	33.3% #616DA7	RGB 97 109 167	#616DA7
50.0%	50.0% #7782B5	RGB 119 130 181	#7782B5
66.7%	66.7% #9098C2	RGB 144 152 194	#9098C2
83.3%	83.3% #AAB1D0	RGB 170 177 208	#AAB1D0
100.0%	100.0% #C7CBDE	RGB 199 203 222	#C7CBDE

#3C4A8C #4D5B99 #616DA7 #7782B5 #9098C2 #AAB1D0 #C7CBDE

#3C4A8C - #7782B5 - #C7CBDE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C4A8C 0%, #7782B5 50%, #C7CBDE 100%);
    background: -webkit-linear-gradient(top, #3C4A8C 0%, #7782B5 50%, #C7CBDE 100%);
    background: linear-gradient(to bottom, #3C4A8C 0%, #7782B5 50%, #C7CBDE 100%);
}
</style>