#376A72 - #889B9F | 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 #376A72 to #889B9F

#376A72 #889B9F

Calculate the color between two colors, #376A72 and #889B9F. 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)

#376A72 - #889B9F | 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 #376A72 as 0% and #889B9F as 100%.

0.0%	0.0% #376A72	RGB 55 106 114	#376A72
16.7%	16.7% #447279	RGB 68 114 121	#447279
33.3%	33.3% #527A81	RGB 82 122 129	#527A81
50.0%	50.0% #5F8288	RGB 95 130 136	#5F8288
66.7%	66.7% #6D8A90	RGB 109 138 144	#6D8A90
83.3%	83.3% #7A9297	RGB 122 146 151	#7A9297
100.0%	100.0% #889B9F	RGB 136 155 159	#889B9F

#376A72 #447279 #527A81 #5F8288 #6D8A90 #7A9297 #889B9F

#376A72 - #889B9F

HSV Blend

#376A72 - #889B9F | 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 #376A72 as 0% and #889B9F as 100%.

0.0%	0.0% #376A72	RGB 55 106 114	#376A72
16.7%	16.7% #427179	RGB 66 113 121	#427179
33.3%	33.3% #4E7981	RGB 78 121 129	#4E7981
50.0%	50.0% #5B8188	RGB 91 129 136	#5B8188
66.7%	66.7% #698990	RGB 105 137 144	#698990
83.3%	83.3% #789297	RGB 120 146 151	#789297
100.0%	100.0% #889B9F	RGB 136 155 159	#889B9F

#376A72 #427179 #4E7981 #5B8188 #698990 #789297 #889B9F

#376A72 - #5B8188 - #889B9F

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #376A72 0%, #5B8188 50%, #889B9F 100%);
    background: -webkit-linear-gradient(top, #376A72 0%, #5B8188 50%, #889B9F 100%);
    background: linear-gradient(to bottom, #376A72 0%, #5B8188 50%, #889B9F 100%);
}
</style>