#677A7E - #8ADDC8 | 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 #677A7E to #8ADDC8

#677A7E #8ADDC8

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

#677A7E - #8ADDC8 | 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 #677A7E as 0% and #8ADDC8 as 100%.

0.0%	0.0% #677A7E	RGB 103 122 126	#677A7E
16.7%	16.7% #6C8A8A	RGB 108 138 138	#6C8A8A
33.3%	33.3% #729B96	RGB 114 155 150	#729B96
50.0%	50.0% #78ABA3	RGB 120 171 163	#78ABA3
66.7%	66.7% #7EBCAF	RGB 126 188 175	#7EBCAF
83.3%	83.3% #84CCBB	RGB 132 204 187	#84CCBB
100.0%	100.0% #8ADDC8	RGB 138 221 200	#8ADDC8

#677A7E #6C8A8A #729B96 #78ABA3 #7EBCAF #84CCBB #8ADDC8

#677A7E - #8ADDC8

HSV Blend

#677A7E - #8ADDC8 | 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 #677A7E as 0% and #8ADDC8 as 100%.

0.0%	0.0% #677A7E	RGB 103 122 126	#677A7E
16.7%	16.7% #6F8A8D	RGB 111 138 141	#6F8A8D
33.3%	33.3% #769C9D	RGB 118 156 157	#769C9D
50.0%	50.0% #7DADAB	RGB 125 173 171	#7DADAB
66.7%	66.7% #82BDB6	RGB 130 189 182	#82BDB6
83.3%	83.3% #86CDC0	RGB 134 205 192	#86CDC0
100.0%	100.0% #8ADDC8	RGB 138 221 200	#8ADDC8

#677A7E #6F8A8D #769C9D #7DADAB #82BDB6 #86CDC0 #8ADDC8

#677A7E - #7DADAB - #8ADDC8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #677A7E 0%, #7DADAB 50%, #8ADDC8 100%);
    background: -webkit-linear-gradient(top, #677A7E 0%, #7DADAB 50%, #8ADDC8 100%);
    background: linear-gradient(to bottom, #677A7E 0%, #7DADAB 50%, #8ADDC8 100%);
}
</style>