#3C677D - #AAB1A8 | 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 #3C677D to #AAB1A8

#3C677D #AAB1A8

Calculate the color between two colors, #3C677D and #AAB1A8. 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)

#3C677D - #AAB1A8 | 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 #3C677D as 0% and #AAB1A8 as 100%.

0.0%	0.0% #3C677D	RGB 60 103 125	#3C677D
16.7%	16.7% #4E7384	RGB 78 115 132	#4E7384
33.3%	33.3% #607F8B	RGB 96 127 139	#607F8B
50.0%	50.0% #738C92	RGB 115 140 146	#738C92
66.7%	66.7% #859899	RGB 133 152 153	#859899
83.3%	83.3% #97A4A0	RGB 151 164 160	#97A4A0
100.0%	100.0% #AAB1A8	RGB 170 177 168	#AAB1A8

#3C677D #4E7384 #607F8B #738C92 #859899 #97A4A0 #AAB1A8

#3C677D - #AAB1A8

HSV Blend

#3C677D - #AAB1A8 | 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 #3C677D as 0% and #AAB1A8 as 100%.

0.0%	0.0% #3C677D	RGB 60 103 125	#3C677D
16.7%	16.7% #4A8185	RGB 74 129 133	#4A8185
33.3%	33.3% #5A8E84	RGB 90 142 132	#5A8E84
50.0%	50.0% #6B9783	RGB 107 151 131	#6B9783
66.7%	66.7% #7E9F88	RGB 126 159 136	#7E9F88
83.3%	83.3% #92A893	RGB 146 168 147	#92A893
100.0%	100.0% #AAB1A8	RGB 170 177 168	#AAB1A8

#3C677D #4A8185 #5A8E84 #6B9783 #7E9F88 #92A893 #AAB1A8

#3C677D - #6B9783 - #AAB1A8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C677D 0%, #6B9783 50%, #AAB1A8 100%);
    background: -webkit-linear-gradient(top, #3C677D 0%, #6B9783 50%, #AAB1A8 100%);
    background: linear-gradient(to bottom, #3C677D 0%, #6B9783 50%, #AAB1A8 100%);
}
</style>