#3C7E6F - #63C3E1 | 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 #3C7E6F to #63C3E1

#3C7E6F #63C3E1

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

#3C7E6F - #63C3E1 | 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 #3C7E6F as 0% and #63C3E1 as 100%.

0.0%	0.0% #3C7E6F	RGB 60 126 111	#3C7E6F
16.7%	16.7% #428982	RGB 66 137 130	#428982
33.3%	33.3% #499595	RGB 73 149 149	#499595
50.0%	50.0% #4FA0A8	RGB 79 160 168	#4FA0A8
66.7%	66.7% #56ACBB	RGB 86 172 187	#56ACBB
83.3%	83.3% #5CB7CE	RGB 92 183 206	#5CB7CE
100.0%	100.0% #63C3E1	RGB 99 195 225	#63C3E1

#3C7E6F #428982 #499595 #4FA0A8 #56ACBB #5CB7CE #63C3E1

#3C7E6F - #63C3E1

HSV Blend

#3C7E6F - #63C3E1 | 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 #3C7E6F as 0% and #63C3E1 as 100%.

0.0%	0.0% #3C7E6F	RGB 60 126 111	#3C7E6F
16.7%	16.7% #428E83	RGB 66 142 131	#428E83
33.3%	33.3% #499F98	RGB 73 159 152	#499F98
50.0%	50.0% #50AEAF	RGB 80 174 175	#50AEAF
66.7%	66.7% #56B7C0	RGB 86 183 192	#56B7C0
83.3%	83.3% #5CBDD0	RGB 92 189 208	#5CBDD0
100.0%	100.0% #63C3E1	RGB 99 195 225	#63C3E1

#3C7E6F #428E83 #499F98 #50AEAF #56B7C0 #5CBDD0 #63C3E1

#3C7E6F - #50AEAF - #63C3E1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C7E6F 0%, #50AEAF 50%, #63C3E1 100%);
    background: -webkit-linear-gradient(top, #3C7E6F 0%, #50AEAF 50%, #63C3E1 100%);
    background: linear-gradient(to bottom, #3C7E6F 0%, #50AEAF 50%, #63C3E1 100%);
}
</style>