#5E8AAD - #C4C8C3 | 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 #5E8AAD to #C4C8C3

#5E8AAD #C4C8C3

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

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

0.0%	0.0% #5E8AAD	RGB 94 138 173	#5E8AAD
16.7%	16.7% #6F94B0	RGB 111 148 176	#6F94B0
33.3%	33.3% #809EB4	RGB 128 158 180	#809EB4
50.0%	50.0% #91A9B8	RGB 145 169 184	#91A9B8
66.7%	66.7% #A2B3BB	RGB 162 179 187	#A2B3BB
83.3%	83.3% #B3BDBF	RGB 179 189 191	#B3BDBF
100.0%	100.0% #C4C8C3	RGB 196 200 195	#C4C8C3

#5E8AAD #6F94B0 #809EB4 #91A9B8 #A2B3BB #B3BDBF #C4C8C3

#5E8AAD - #C4C8C3

HSV Blend

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

0.0%	0.0% #5E8AAD	RGB 94 138 173	#5E8AAD
16.7%	16.7% #6DA5B1	RGB 109 165 177	#6DA5B1
33.3%	33.3% #7DB6B0	RGB 125 182 176	#7DB6B0
50.0%	50.0% #8DBAA9	RGB 141 186 169	#8DBAA9
66.7%	66.7% #9EBFA9	RGB 158 191 169	#9EBFA9
83.3%	83.3% #B0C3B1	RGB 176 195 177	#B0C3B1
100.0%	100.0% #C4C8C3	RGB 196 200 195	#C4C8C3

#5E8AAD #6DA5B1 #7DB6B0 #8DBAA9 #9EBFA9 #B0C3B1 #C4C8C3

#5E8AAD - #8DBAA9 - #C4C8C3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E8AAD 0%, #8DBAA9 50%, #C4C8C3 100%);
    background: -webkit-linear-gradient(top, #5E8AAD 0%, #8DBAA9 50%, #C4C8C3 100%);
    background: linear-gradient(to bottom, #5E8AAD 0%, #8DBAA9 50%, #C4C8C3 100%);
}
</style>