#3C7E5A - #9DC96F | 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 #3C7E5A to #9DC96F

#3C7E5A #9DC96F

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

#3C7E5A - #9DC96F | 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 #3C7E5A as 0% and #9DC96F as 100%.

0.0%	0.0% #3C7E5A	RGB 60 126 90	#3C7E5A
16.7%	16.7% #4C8A5D	RGB 76 138 93	#4C8A5D
33.3%	33.3% #5C9761	RGB 92 151 97	#5C9761
50.0%	50.0% #6CA364	RGB 108 163 100	#6CA364
66.7%	66.7% #7CB068	RGB 124 176 104	#7CB068
83.3%	83.3% #8CBC6B	RGB 140 188 107	#8CBC6B
100.0%	100.0% #9DC96F	RGB 157 201 111	#9DC96F

#3C7E5A #4C8A5D #5C9761 #6CA364 #7CB068 #8CBC6B #9DC96F

#3C7E5A - #9DC96F

HSV Blend

#3C7E5A - #9DC96F | 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 #3C7E5A as 0% and #9DC96F as 100%.

0.0%	0.0% #3C7E5A	RGB 60 126 90	#3C7E5A
16.7%	16.7% #438A58	RGB 67 138 88	#438A58
33.3%	33.3% #4B9755	RGB 75 151 85	#4B9755
50.0%	50.0% #56A354	RGB 86 163 84	#56A354
66.7%	66.7% #6CB05C	RGB 108 176 92	#6CB05C
83.3%	83.3% #84BC65	RGB 132 188 101	#84BC65
100.0%	100.0% #9DC96F	RGB 157 201 111	#9DC96F

#3C7E5A #438A58 #4B9755 #56A354 #6CB05C #84BC65 #9DC96F

#3C7E5A - #56A354 - #9DC96F

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C7E5A 0%, #56A354 50%, #9DC96F 100%);
    background: -webkit-linear-gradient(top, #3C7E5A 0%, #56A354 50%, #9DC96F 100%);
    background: linear-gradient(to bottom, #3C7E5A 0%, #56A354 50%, #9DC96F 100%);
}
</style>