#4A8584 - #8CCA7F | 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 #4A8584 to #8CCA7F

#4A8584 #8CCA7F

Calculate the color between two colors, #4A8584 and #8CCA7F. 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)

#4A8584 - #8CCA7F | 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 #4A8584 as 0% and #8CCA7F as 100%.

0.0%	0.0% #4A8584	RGB 74 133 132	#4A8584
16.7%	16.7% #559083	RGB 85 144 131	#559083
33.3%	33.3% #609C82	RGB 96 156 130	#609C82
50.0%	50.0% #6BA781	RGB 107 167 129	#6BA781
66.7%	66.7% #76B380	RGB 118 179 128	#76B380
83.3%	83.3% #81BE7F	RGB 129 190 127	#81BE7F
100.0%	100.0% #8CCA7F	RGB 140 202 127	#8CCA7F

#4A8584 #559083 #609C82 #6BA781 #76B380 #81BE7F #8CCA7F

#4A8584 - #8CCA7F

HSV Blend

#4A8584 - #8CCA7F | 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 #4A8584 as 0% and #8CCA7F as 100%.

0.0%	0.0% #4A8584	RGB 74 133 132	#4A8584
16.7%	16.7% #529083	RGB 82 144 131	#529083
33.3%	33.3% #5A9C81	RGB 90 156 129	#5A9C81
50.0%	50.0% #63A77E	RGB 99 167 126	#63A77E
66.7%	66.7% #6CB37B	RGB 108 179 123	#6CB37B
83.3%	83.3% #75BE76	RGB 117 190 118	#75BE76
100.0%	100.0% #8CCA7F	RGB 140 202 127	#8CCA7F

#4A8584 #529083 #5A9C81 #63A77E #6CB37B #75BE76 #8CCA7F

#4A8584 - #63A77E - #8CCA7F

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4A8584 0%, #63A77E 50%, #8CCA7F 100%);
    background: -webkit-linear-gradient(top, #4A8584 0%, #63A77E 50%, #8CCA7F 100%);
    background: linear-gradient(to bottom, #4A8584 0%, #63A77E 50%, #8CCA7F 100%);
}
</style>