#3E7DC8 - #C7D9EF | 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 #3E7DC8 to #C7D9EF

#3E7DC8 #C7D9EF

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

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

0.0%	0.0% #3E7DC8	RGB 62 125 200	#3E7DC8
16.7%	16.7% #548CCE	RGB 84 140 206	#548CCE
33.3%	33.3% #6B9BD5	RGB 107 155 213	#6B9BD5
50.0%	50.0% #82ABDB	RGB 130 171 219	#82ABDB
66.7%	66.7% #99BAE2	RGB 153 186 226	#99BAE2
83.3%	83.3% #B0C9E8	RGB 176 201 232	#B0C9E8
100.0%	100.0% #C7D9EF	RGB 199 217 239	#C7D9EF

#3E7DC8 #548CCE #6B9BD5 #82ABDB #99BAE2 #B0C9E8 #C7D9EF

#3E7DC8 - #C7D9EF

HSV Blend

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

0.0%	0.0% #3E7DC8	RGB 62 125 200	#3E7DC8
16.7%	16.7% #528ACE	RGB 82 138 206	#528ACE
33.3%	33.3% #6799D5	RGB 103 153 213	#6799D5
50.0%	50.0% #7DA8DB	RGB 125 168 219	#7DA8DB
66.7%	66.7% #94B7E2	RGB 148 183 226	#94B7E2
83.3%	83.3% #ADC8E8	RGB 173 200 232	#ADC8E8
100.0%	100.0% #C7D9EF	RGB 199 217 239	#C7D9EF

#3E7DC8 #528ACE #6799D5 #7DA8DB #94B7E2 #ADC8E8 #C7D9EF

#3E7DC8 - #7DA8DB - #C7D9EF

CSS codes

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

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