#3C62F0 - #C7D2FA | 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 #3C62F0 to #C7D2FA

#3C62F0 #C7D2FA

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

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

0.0%	0.0% #3C62F0	RGB 60 98 240	#3C62F0
16.7%	16.7% #5374F1	RGB 83 116 241	#5374F1
33.3%	33.3% #6A87F3	RGB 106 135 243	#6A87F3
50.0%	50.0% #819AF5	RGB 129 154 245	#819AF5
66.7%	66.7% #98ACF6	RGB 152 172 246	#98ACF6
83.3%	83.3% #AFBFF8	RGB 175 191 248	#AFBFF8
100.0%	100.0% #C7D2FA	RGB 199 210 250	#C7D2FA

#3C62F0 #5374F1 #6A87F3 #819AF5 #98ACF6 #AFBFF8 #C7D2FA

#3C62F0 - #C7D2FA

HSV Blend

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

0.0%	0.0% #3C62F0	RGB 60 98 240	#3C62F0
16.7%	16.7% #5274F1	RGB 82 116 241	#5274F1
33.3%	33.3% #6986F3	RGB 105 134 243	#6986F3
50.0%	50.0% #8099F5	RGB 128 153 245	#8099F5
66.7%	66.7% #97ABF6	RGB 151 171 246	#97ABF6
83.3%	83.3% #AFBEF8	RGB 175 190 248	#AFBEF8
100.0%	100.0% #C7D2FA	RGB 199 210 250	#C7D2FA

#3C62F0 #5274F1 #6986F3 #8099F5 #97ABF6 #AFBEF8 #C7D2FA

#3C62F0 - #8099F5 - #C7D2FA

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C62F0 0%, #8099F5 50%, #C7D2FA 100%);
    background: -webkit-linear-gradient(top, #3C62F0 0%, #8099F5 50%, #C7D2FA 100%);
    background: linear-gradient(to bottom, #3C62F0 0%, #8099F5 50%, #C7D2FA 100%);
}
</style>