#80A8A8 - #20736C | 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 #80A8A8 to #20736C

#80A8A8 #20736C

Calculate the color between two colors, #80A8A8 and #20736C. 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)

#80A8A8 - #20736C | 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 #80A8A8 as 0% and #20736C as 100%.

0.0%	0.0% #80A8A8	RGB 128 168 168	#80A8A8
16.7%	16.7% #709F9E	RGB 112 159 158	#709F9E
33.3%	33.3% #609694	RGB 96 150 148	#609694
50.0%	50.0% #508D8A	RGB 80 141 138	#508D8A
66.7%	66.7% #408480	RGB 64 132 128	#408480
83.3%	83.3% #307B76	RGB 48 123 118	#307B76
100.0%	100.0% #20736C	RGB 32 115 108	#20736C

#80A8A8 #709F9E #609694 #508D8A #408480 #307B76 #20736C

#80A8A8 - #20736C

HSV Blend

#80A8A8 - #20736C | 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 #80A8A8 as 0% and #20736C as 100%.

0.0%	0.0% #80A8A8	RGB 128 168 168	#80A8A8
16.7%	16.7% #6C9F9E	RGB 108 159 158	#6C9F9E
33.3%	33.3% #5A9694	RGB 90 150 148	#5A9694
50.0%	50.0% #498D8A	RGB 73 141 138	#498D8A
66.7%	66.7% #3A8480	RGB 58 132 128	#3A8480
83.3%	83.3% #2C7B76	RGB 44 123 118	#2C7B76
100.0%	100.0% #20736C	RGB 32 115 108	#20736C

#80A8A8 #6C9F9E #5A9694 #498D8A #3A8480 #2C7B76 #20736C

#80A8A8 - #498D8A - #20736C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #80A8A8 0%, #498D8A 50%, #20736C 100%);
    background: -webkit-linear-gradient(top, #80A8A8 0%, #498D8A 50%, #20736C 100%);
    background: linear-gradient(to bottom, #80A8A8 0%, #498D8A 50%, #20736C 100%);
}
</style>