#337E3C - #B9CD69 | 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 #337E3C to #B9CD69

#337E3C #B9CD69

Calculate the color between two colors, #337E3C and #B9CD69. 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)

#337E3C - #B9CD69 | 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 #337E3C as 0% and #B9CD69 as 100%.

0.0%	0.0% #337E3C	RGB 51 126 60	#337E3C
16.7%	16.7% #498B43	RGB 73 139 67	#498B43
33.3%	33.3% #5F984B	RGB 95 152 75	#5F984B
50.0%	50.0% #76A552	RGB 118 165 82	#76A552
66.7%	66.7% #8CB25A	RGB 140 178 90	#8CB25A
83.3%	83.3% #A2BF61	RGB 162 191 97	#A2BF61
100.0%	100.0% #B9CD69	RGB 185 205 105	#B9CD69

#337E3C #498B43 #5F984B #76A552 #8CB25A #A2BF61 #B9CD69

#337E3C - #B9CD69

HSV Blend

#337E3C - #B9CD69 | 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 #337E3C as 0% and #B9CD69 as 100%.

0.0%	0.0% #337E3C	RGB 51 126 60	#337E3C
16.7%	16.7% #3D8B3A	RGB 61 139 58	#3D8B3A
33.3%	33.3% #539843	RGB 83 152 67	#539843
50.0%	50.0% #6AA54B	RGB 106 165 75	#6AA54B
66.7%	66.7% #83B255	RGB 131 178 85	#83B255
83.3%	83.3% #9DBF5E	RGB 157 191 94	#9DBF5E
100.0%	100.0% #B9CD69	RGB 185 205 105	#B9CD69

#337E3C #3D8B3A #539843 #6AA54B #83B255 #9DBF5E #B9CD69

#337E3C - #6AA54B - #B9CD69

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #337E3C 0%, #6AA54B 50%, #B9CD69 100%);
    background: -webkit-linear-gradient(top, #337E3C 0%, #6AA54B 50%, #B9CD69 100%);
    background: linear-gradient(to bottom, #337E3C 0%, #6AA54B 50%, #B9CD69 100%);
}
</style>