#688080 - #AFBC8C | 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 #688080 to #AFBC8C

#688080 #AFBC8C

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

#688080 - #AFBC8C | 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 #688080 as 0% and #AFBC8C as 100%.

0.0%	0.0% #688080	RGB 104 128 128	#688080
16.7%	16.7% #738A82	RGB 115 138 130	#738A82
33.3%	33.3% #7F9484	RGB 127 148 132	#7F9484
50.0%	50.0% #8B9E86	RGB 139 158 134	#8B9E86
66.7%	66.7% #97A888	RGB 151 168 136	#97A888
83.3%	83.3% #A3B28A	RGB 163 178 138	#A3B28A
100.0%	100.0% #AFBC8C	RGB 175 188 140	#AFBC8C

#688080 #738A82 #7F9484 #8B9E86 #97A888 #A3B28A #AFBC8C

#688080 - #AFBC8C

HSV Blend

#688080 - #AFBC8C | 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 #688080 as 0% and #AFBC8C as 100%.

0.0%	0.0% #688080	RGB 104 128 128	#688080
16.7%	16.7% #6E8A82	RGB 110 138 130	#6E8A82
33.3%	33.3% #749482	RGB 116 148 130	#749482
50.0%	50.0% #7B9E7F	RGB 123 158 127	#7B9E7F
66.7%	66.7% #86A880	RGB 134 168 128	#86A880
83.3%	83.3% #99B286	RGB 153 178 134	#99B286
100.0%	100.0% #AFBC8C	RGB 175 188 140	#AFBC8C

#688080 #6E8A82 #749482 #7B9E7F #86A880 #99B286 #AFBC8C

#688080 - #7B9E7F - #AFBC8C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #688080 0%, #7B9E7F 50%, #AFBC8C 100%);
    background: -webkit-linear-gradient(top, #688080 0%, #7B9E7F 50%, #AFBC8C 100%);
    background: linear-gradient(to bottom, #688080 0%, #7B9E7F 50%, #AFBC8C 100%);
}
</style>