#3C7E72 - #084D36 | 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 #3C7E72 to #084D36

#3C7E72 #084D36

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

#3C7E72 - #084D36 | 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 #3C7E72 as 0% and #084D36 as 100%.

0.0%	0.0% #3C7E72	RGB 60 126 114	#3C7E72
16.7%	16.7% #337568	RGB 51 117 104	#337568
33.3%	33.3% #2A6D5E	RGB 42 109 94	#2A6D5E
50.0%	50.0% #226554	RGB 34 101 84	#226554
66.7%	66.7% #195D4A	RGB 25 93 74	#195D4A
83.3%	83.3% #105540	RGB 16 85 64	#105540
100.0%	100.0% #084D36	RGB 8 77 54	#084D36

#3C7E72 #337568 #2A6D5E #226554 #195D4A #105540 #084D36

#3C7E72 - #084D36

HSV Blend

#3C7E72 - #084D36 | 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 #3C7E72 as 0% and #084D36 as 100%.

0.0%	0.0% #3C7E72	RGB 60 126 114	#3C7E72
16.7%	16.7% #307567	RGB 48 117 103	#307567
33.3%	33.3% #266D5D	RGB 38 109 93	#266D5D
50.0%	50.0% #1D6552	RGB 29 101 82	#1D6552
66.7%	66.7% #155D48	RGB 21 93 72	#155D48
83.3%	83.3% #0E553F	RGB 14 85 63	#0E553F
100.0%	100.0% #084D36	RGB 8 77 54	#084D36

#3C7E72 #307567 #266D5D #1D6552 #155D48 #0E553F #084D36

#3C7E72 - #1D6552 - #084D36

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C7E72 0%, #1D6552 50%, #084D36 100%);
    background: -webkit-linear-gradient(top, #3C7E72 0%, #1D6552 50%, #084D36 100%);
    background: linear-gradient(to bottom, #3C7E72 0%, #1D6552 50%, #084D36 100%);
}
</style>