#3C6B3C - #BBB863 | 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 #3C6B3C to #BBB863

#3C6B3C #BBB863

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

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

0.0%	0.0% #3C6B3C	RGB 60 107 60	#3C6B3C
16.7%	16.7% #517742	RGB 81 119 66	#517742
33.3%	33.3% #668449	RGB 102 132 73	#668449
50.0%	50.0% #7B914F	RGB 123 145 79	#7B914F
66.7%	66.7% #909E56	RGB 144 158 86	#909E56
83.3%	83.3% #A5AB5C	RGB 165 171 92	#A5AB5C
100.0%	100.0% #BBB863	RGB 187 184 99	#BBB863

#3C6B3C #517742 #668449 #7B914F #909E56 #A5AB5C #BBB863

#3C6B3C - #BBB863

HSV Blend

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

0.0%	0.0% #3C6B3C	RGB 60 107 60	#3C6B3C
16.7%	16.7% #4C7842	RGB 76 120 66	#4C7842
33.3%	33.3% #5E8549	RGB 94 133 73	#5E8549
50.0%	50.0% #729350	RGB 114 147 80	#729350
66.7%	66.7% #89A056	RGB 137 160 86	#89A056
83.3%	83.3% #A2AD5C	RGB 162 173 92	#A2AD5C
100.0%	100.0% #BBB863	RGB 187 184 99	#BBB863

#3C6B3C #4C7842 #5E8549 #729350 #89A056 #A2AD5C #BBB863

#3C6B3C - #729350 - #BBB863

CSS codes

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

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