#3E7FA8 - #C7D9E6 | 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 #3E7FA8 to #C7D9E6

#3E7FA8 #C7D9E6

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

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

0.0%	0.0% #3E7FA8	RGB 62 127 168	#3E7FA8
16.7%	16.7% #548EB2	RGB 84 142 178	#548EB2
33.3%	33.3% #6B9DBC	RGB 107 157 188	#6B9DBC
50.0%	50.0% #82ACC7	RGB 130 172 199	#82ACC7
66.7%	66.7% #99BBD1	RGB 153 187 209	#99BBD1
83.3%	83.3% #B0CADB	RGB 176 202 219	#B0CADB
100.0%	100.0% #C7D9E6	RGB 199 217 230	#C7D9E6

#3E7FA8 #548EB2 #6B9DBC #82ACC7 #99BBD1 #B0CADB #C7D9E6

#3E7FA8 - #C7D9E6

HSV Blend

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

0.0%	0.0% #3E7FA8	RGB 62 127 168	#3E7FA8
16.7%	16.7% #508BB2	RGB 80 139 178	#508BB2
33.3%	33.3% #6499BC	RGB 100 153 188	#6499BC
50.0%	50.0% #7AA8C7	RGB 122 168 199	#7AA8C7
66.7%	66.7% #92B7D1	RGB 146 183 209	#92B7D1
83.3%	83.3% #ABC7DB	RGB 171 199 219	#ABC7DB
100.0%	100.0% #C7D9E6	RGB 199 217 230	#C7D9E6

#3E7FA8 #508BB2 #6499BC #7AA8C7 #92B7D1 #ABC7DB #C7D9E6

#3E7FA8 - #7AA8C7 - #C7D9E6

CSS codes

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

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