#A8C4AF - #508677 | 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 #A8C4AF to #508677

#A8C4AF #508677

Calculate the color between two colors, #A8C4AF and #508677. 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)

#A8C4AF - #508677 | 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 #A8C4AF as 0% and #508677 as 100%.

0.0%	0.0% #A8C4AF	RGB 168 196 175	#A8C4AF
16.7%	16.7% #99B9A5	RGB 153 185 165	#99B9A5
33.3%	33.3% #8AAF9C	RGB 138 175 156	#8AAF9C
50.0%	50.0% #7CA593	RGB 124 165 147	#7CA593
66.7%	66.7% #6D9A89	RGB 109 154 137	#6D9A89
83.3%	83.3% #5E9080	RGB 94 144 128	#5E9080
100.0%	100.0% #508677	RGB 80 134 119	#508677

#A8C4AF #99B9A5 #8AAF9C #7CA593 #6D9A89 #5E9080 #508677

#A8C4AF - #508677

HSV Blend

#A8C4AF - #508677 | 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 #A8C4AF as 0% and #508677 as 100%.

0.0%	0.0% #A8C4AF	RGB 168 196 175	#A8C4AF
16.7%	16.7% #97B9A2	RGB 151 185 162	#97B9A2
33.3%	33.3% #87AF97	RGB 135 175 151	#87AF97
50.0%	50.0% #77A58D	RGB 119 165 141	#77A58D
66.7%	66.7% #699A85	RGB 105 154 133	#699A85
83.3%	83.3% #5C907D	RGB 92 144 125	#5C907D
100.0%	100.0% #508677	RGB 80 134 119	#508677

#A8C4AF #97B9A2 #87AF97 #77A58D #699A85 #5C907D #508677

#A8C4AF - #77A58D - #508677

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8C4AF 0%, #77A58D 50%, #508677 100%);
    background: -webkit-linear-gradient(top, #A8C4AF 0%, #77A58D 50%, #508677 100%);
    background: linear-gradient(to bottom, #A8C4AF 0%, #77A58D 50%, #508677 100%);
}
</style>