#AFAFBC - #655A8C | 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 #AFAFBC to #655A8C

#AFAFBC #655A8C

Calculate the color between two colors, #AFAFBC and #655A8C. 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)

#AFAFBC - #655A8C | 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 #AFAFBC as 0% and #655A8C as 100%.

0.0%	0.0% #AFAFBC	RGB 175 175 188	#AFAFBC
16.7%	16.7% #A2A0B4	RGB 162 160 180	#A2A0B4
33.3%	33.3% #9692AC	RGB 150 146 172	#9692AC
50.0%	50.0% #8A84A4	RGB 138 132 164	#8A84A4
66.7%	66.7% #7D769C	RGB 125 118 156	#7D769C
83.3%	83.3% #716894	RGB 113 104 148	#716894
100.0%	100.0% #655A8C	RGB 101 90 140	#655A8C

#AFAFBC #A2A0B4 #9692AC #8A84A4 #7D769C #716894 #655A8C

#AFAFBC - #655A8C

HSV Blend

#AFAFBC - #655A8C | 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 #AFAFBC as 0% and #655A8C as 100%.

0.0%	0.0% #AFAFBC	RGB 175 175 188	#AFAFBC
16.7%	16.7% #9F9EB4	RGB 159 158 180	#9F9EB4
33.3%	33.3% #918FAC	RGB 145 143 172	#918FAC
50.0%	50.0% #8481A4	RGB 132 129 164	#8481A4
66.7%	66.7% #79739C	RGB 121 115 156	#79739C
83.3%	83.3% #6E6694	RGB 110 102 148	#6E6694
100.0%	100.0% #655A8C	RGB 101 90 140	#655A8C

#AFAFBC #9F9EB4 #918FAC #8481A4 #79739C #6E6694 #655A8C

#AFAFBC - #8481A4 - #655A8C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AFAFBC 0%, #8481A4 50%, #655A8C 100%);
    background: -webkit-linear-gradient(top, #AFAFBC 0%, #8481A4 50%, #655A8C 100%);
    background: linear-gradient(to bottom, #AFAFBC 0%, #8481A4 50%, #655A8C 100%);
}
</style>