#3C60BE - #C7D0EC | 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 #3C60BE to #C7D0EC

#3C60BE #C7D0EC

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

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

0.0%	0.0% #3C60BE	RGB 60 96 190	#3C60BE
16.7%	16.7% #5372C5	RGB 83 114 197	#5372C5
33.3%	33.3% #6A85CD	RGB 106 133 205	#6A85CD
50.0%	50.0% #8198D5	RGB 129 152 213	#8198D5
66.7%	66.7% #98AADC	RGB 152 170 220	#98AADC
83.3%	83.3% #AFBDE4	RGB 175 189 228	#AFBDE4
100.0%	100.0% #C7D0EC	RGB 199 208 236	#C7D0EC

#3C60BE #5372C5 #6A85CD #8198D5 #98AADC #AFBDE4 #C7D0EC

#3C60BE - #C7D0EC

HSV Blend

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

0.0%	0.0% #3C5FBE	RGB 60 95 190	#3C5FBE
16.7%	16.7% #4F6FC5	RGB 79 111 197	#4F6FC5
33.3%	33.3% #6480CD	RGB 100 128 205	#6480CD
50.0%	50.0% #7B92D5	RGB 123 146 213	#7B92D5
66.7%	66.7% #93A5DC	RGB 147 165 220	#93A5DC
83.3%	83.3% #ACBAE4	RGB 172 186 228	#ACBAE4
100.0%	100.0% #C7D0EC	RGB 199 208 236	#C7D0EC

#3C5FBE #4F6FC5 #6480CD #7B92D5 #93A5DC #ACBAE4 #C7D0EC

#3C60BE - #7B92D5 - #C7D0EC

CSS codes

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

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