#677A8F - #C6BAAB | 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 #677A8F to #C6BAAB

#677A8F #C6BAAB

Calculate the color between two colors, #677A8F and #C6BAAB. 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)

#677A8F - #C6BAAB | 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 #677A8F as 0% and #C6BAAB as 100%.

0.0%	0.0% #677A8F	RGB 103 122 143	#677A8F
16.7%	16.7% #768493	RGB 118 132 147	#768493
33.3%	33.3% #868F98	RGB 134 143 152	#868F98
50.0%	50.0% #969A9D	RGB 150 154 157	#969A9D
66.7%	66.7% #A6A4A1	RGB 166 164 161	#A6A4A1
83.3%	83.3% #B6AFA6	RGB 182 175 166	#B6AFA6
100.0%	100.0% #C6BAAB	RGB 198 186 171	#C6BAAB

#677A8F #768493 #868F98 #969A9D #A6A4A1 #B6AFA6 #C6BAAB

#677A8F - #C6BAAB

HSV Blend

#677A8F - #C6BAAB | 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 #677A8F as 0% and #C6BAAB as 100%.

0.0%	0.0% #677A8F	RGB 103 122 143	#677A8F
16.7%	16.7% #719698	RGB 113 150 152	#719698
33.3%	33.3% #7BA18F	RGB 123 161 143	#7BA18F
50.0%	50.0% #87AA88	RGB 135 170 136	#87AA88
66.7%	66.7% #A1B392	RGB 161 179 146	#A1B392
83.3%	83.3% #BBBC9E	RGB 187 188 158	#BBBC9E
100.0%	100.0% #C6BAAB	RGB 198 186 171	#C6BAAB

#677A8F #719698 #7BA18F #87AA88 #A1B392 #BBBC9E #C6BAAB

#677A8F - #87AA88 - #C6BAAB

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #677A8F 0%, #87AA88 50%, #C6BAAB 100%);
    background: -webkit-linear-gradient(top, #677A8F 0%, #87AA88 50%, #C6BAAB 100%);
    background: linear-gradient(to bottom, #677A8F 0%, #87AA88 50%, #C6BAAB 100%);
}
</style>