#5E6FA8 - #AFB3C1 | 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 #5E6FA8 to #AFB3C1

#5E6FA8 #AFB3C1

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

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

0.0%	0.0% #5E6FA8	RGB 94 111 168	#5E6FA8
16.7%	16.7% #6B7AAC	RGB 107 122 172	#6B7AAC
33.3%	33.3% #7985B0	RGB 121 133 176	#7985B0
50.0%	50.0% #8691B4	RGB 134 145 180	#8691B4
66.7%	66.7% #949CB8	RGB 148 156 184	#949CB8
83.3%	83.3% #A1A7BC	RGB 161 167 188	#A1A7BC
100.0%	100.0% #AFB3C1	RGB 175 179 193	#AFB3C1

#5E6FA8 #6B7AAC #7985B0 #8691B4 #949CB8 #A1A7BC #AFB3C1

#5E6FA8 - #AFB3C1

HSV Blend

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

0.0%	0.0% #5E6EA8	RGB 94 110 168	#5E6EA8
16.7%	16.7% #6A79AC	RGB 106 121 172	#6A79AC
33.3%	33.3% #7784B0	RGB 119 132 176	#7784B0
50.0%	50.0% #848FB4	RGB 132 143 180	#848FB4
66.7%	66.7% #929AB8	RGB 146 154 184	#929AB8
83.3%	83.3% #A0A6BC	RGB 160 166 188	#A0A6BC
100.0%	100.0% #AFB3C1	RGB 175 179 193	#AFB3C1

#5E6EA8 #6A79AC #7784B0 #848FB4 #929AB8 #A0A6BC #AFB3C1

#5E6FA8 - #848FB4 - #AFB3C1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E6EA8 0%, #848FB4 50%, #AFB3C1 100%);
    background: -webkit-linear-gradient(top, #5E6EA8 0%, #848FB4 50%, #AFB3C1 100%);
    background: linear-gradient(to bottom, #5E6EA8 0%, #848FB4 50%, #AFB3C1 100%);
}
</style>