#5E7677 - #CCBA9E | 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 #5E7677 to #CCBA9E

#5E7677 #CCBA9E

Calculate the color between two colors, #5E7677 and #CCBA9E. 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)

#5E7677 - #CCBA9E | 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 #5E7677 as 0% and #CCBA9E as 100%.

0.0%	0.0% #5E7677	RGB 94 118 119	#5E7677
16.7%	16.7% #70817D	RGB 112 129 125	#70817D
33.3%	33.3% #828C84	RGB 130 140 132	#828C84
50.0%	50.0% #95988A	RGB 149 152 138	#95988A
66.7%	66.7% #A7A391	RGB 167 163 145	#A7A391
83.3%	83.3% #B9AE97	RGB 185 174 151	#B9AE97
100.0%	100.0% #CCBA9E	RGB 204 186 158	#CCBA9E

#5E7677 #70817D #828C84 #95988A #A7A391 #B9AE97 #CCBA9E

#5E7677 - #CCBA9E

HSV Blend

#5E7677 - #CCBA9E | 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 #5E7677 as 0% and #CCBA9E as 100%.

0.0%	0.0% #5E7677	RGB 94 118 119	#5E7677
16.7%	16.7% #68857A	RGB 104 133 122	#68857A
33.3%	33.3% #73937A	RGB 115 147 122	#73937A
50.0%	50.0% #84A17E	RGB 132 161 126	#84A17E
66.7%	66.7% #9FAF88	RGB 159 175 136	#9FAF88
83.3%	83.3% #BDBD93	RGB 189 189 147	#BDBD93
100.0%	100.0% #CCBA9E	RGB 204 186 158	#CCBA9E

#5E7677 #68857A #73937A #84A17E #9FAF88 #BDBD93 #CCBA9E

#5E7677 - #84A17E - #CCBA9E

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E7677 0%, #84A17E 50%, #CCBA9E 100%);
    background: -webkit-linear-gradient(top, #5E7677 0%, #84A17E 50%, #CCBA9E 100%);
    background: linear-gradient(to bottom, #5E7677 0%, #84A17E 50%, #CCBA9E 100%);
}
</style>