#3C7DAC - #C8DEC5 | 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 #3C7DAC to #C8DEC5

#3C7DAC #C8DEC5

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

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

0.0%	0.0% #3C7DAC	RGB 60 125 172	#3C7DAC
16.7%	16.7% #538DB0	RGB 83 141 176	#538DB0
33.3%	33.3% #6A9DB4	RGB 106 157 180	#6A9DB4
50.0%	50.0% #82ADB8	RGB 130 173 184	#82ADB8
66.7%	66.7% #99BDBC	RGB 153 189 188	#99BDBC
83.3%	83.3% #B0CDC0	RGB 176 205 192	#B0CDC0
100.0%	100.0% #C8DEC5	RGB 200 222 197	#C8DEC5

#3C7DAC #538DB0 #6A9DB4 #82ADB8 #99BDBC #B0CDC0 #C8DEC5

#3C7DAC - #C8DEC5

HSV Blend

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

0.0%	0.0% #3C7DAC	RGB 60 125 172	#3C7DAC
16.7%	16.7% #4FA3B4	RGB 79 163 180	#4FA3B4
33.3%	33.3% #63BCB4	RGB 99 188 180	#63BCB4
50.0%	50.0% #79C5AA	RGB 121 197 170	#79C5AA
66.7%	66.7% #91CDA8	RGB 145 205 168	#91CDA8
83.3%	83.3% #AAD5B0	RGB 170 213 176	#AAD5B0
100.0%	100.0% #C8DEC5	RGB 200 222 197	#C8DEC5

#3C7DAC #4FA3B4 #63BCB4 #79C5AA #91CDA8 #AAD5B0 #C8DEC5

#3C7DAC - #79C5AA - #C8DEC5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C7DAC 0%, #79C5AA 50%, #C8DEC5 100%);
    background: -webkit-linear-gradient(top, #3C7DAC 0%, #79C5AA 50%, #C8DEC5 100%);
    background: linear-gradient(to bottom, #3C7DAC 0%, #79C5AA 50%, #C8DEC5 100%);
}
</style>