#3A5E4A - #5DCE94 | 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 #3A5E4A to #5DCE94

#3A5E4A #5DCE94

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

#3A5E4A - #5DCE94 | 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 #3A5E4A as 0% and #5DCE94 as 100%.

0.0%	0.0% #3A5E4A	RGB 58 94 74	#3A5E4A
16.7%	16.7% #3F7056	RGB 63 112 86	#3F7056
33.3%	33.3% #458362	RGB 69 131 98	#458362
50.0%	50.0% #4B966F	RGB 75 150 111	#4B966F
66.7%	66.7% #51A87B	RGB 81 168 123	#51A87B
83.3%	83.3% #57BB87	RGB 87 187 135	#57BB87
100.0%	100.0% #5DCE94	RGB 93 206 148	#5DCE94

#3A5E4A #3F7056 #458362 #4B966F #51A87B #57BB87 #5DCE94

#3A5E4A - #5DCE94

HSV Blend

#3A5E4A - #5DCE94 | 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 #3A5E4A as 0% and #5DCE94 as 100%.

0.0%	0.0% #3A5E4A	RGB 58 94 74	#3A5E4A
16.7%	16.7% #427057	RGB 66 112 87	#427057
33.3%	33.3% #498364	RGB 73 131 100	#498364
50.0%	50.0% #509670	RGB 80 150 112	#509670
66.7%	66.7% #55A87C	RGB 85 168 124	#55A87C
83.3%	83.3% #59BB88	RGB 89 187 136	#59BB88
100.0%	100.0% #5DCE94	RGB 93 206 148	#5DCE94

#3A5E4A #427057 #498364 #509670 #55A87C #59BB88 #5DCE94

#3A5E4A - #509670 - #5DCE94

CSS codes

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

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