#577685 - #B5A8A6 | 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 #577685 to #B5A8A6

#577685 #B5A8A6

Calculate the color between two colors, #577685 and #B5A8A6. 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)

#577685 - #B5A8A6 | 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 #577685 as 0% and #B5A8A6 as 100%.

0.0%	0.0% #577685	RGB 87 118 133	#577685
16.7%	16.7% #667E8A	RGB 102 126 138	#667E8A
33.3%	33.3% #768690	RGB 118 134 144	#768690
50.0%	50.0% #868F95	RGB 134 143 149	#868F95
66.7%	66.7% #95979B	RGB 149 151 155	#95979B
83.3%	83.3% #A59FA0	RGB 165 159 160	#A59FA0
100.0%	100.0% #B5A8A6	RGB 181 168 166	#B5A8A6

#577685 #667E8A #768690 #868F95 #95979B #A59FA0 #B5A8A6

#577685 - #B5A8A6

HSV Blend

#577685 - #B5A8A6 | 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 #577685 as 0% and #B5A8A6 as 100%.

0.0%	0.0% #577685	RGB 87 118 133	#577685
16.7%	16.7% #626B8D	RGB 98 107 141	#626B8D
33.3%	33.3% #786E95	RGB 120 110 149	#786E95
50.0%	50.0% #937B9D	RGB 147 123 157	#937B9D
66.7%	66.7% #A5889F	RGB 165 136 159	#A5889F
83.3%	83.3% #AD979E	RGB 173 151 158	#AD979E
100.0%	100.0% #B5A8A6	RGB 181 168 166	#B5A8A6

#577685 #626B8D #786E95 #937B9D #A5889F #AD979E #B5A8A6

#577685 - #937B9D - #B5A8A6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #577685 0%, #937B9D 50%, #B5A8A6 100%);
    background: -webkit-linear-gradient(top, #577685 0%, #937B9D 50%, #B5A8A6 100%);
    background: linear-gradient(to bottom, #577685 0%, #937B9D 50%, #B5A8A6 100%);
}
</style>