#B87FD4 - #AFE3E6 | 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 #B87FD4 to #AFE3E6

#B87FD4 #AFE3E6

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

#B87FD4 - #AFE3E6 | 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 #B87FD4 as 0% and #AFE3E6 as 100%.

0.0%	0.0% #B87FD4	RGB 184 127 212	#B87FD4
16.7%	16.7% #B68FD7	RGB 182 143 215	#B68FD7
33.3%	33.3% #B5A0DA	RGB 181 160 218	#B5A0DA
50.0%	50.0% #B3B1DD	RGB 179 177 221	#B3B1DD
66.7%	66.7% #B2C1E0	RGB 178 193 224	#B2C1E0
83.3%	83.3% #B0D2E3	RGB 176 210 227	#B0D2E3
100.0%	100.0% #AFE3E6	RGB 175 227 230	#AFE3E6

#B87FD4 #B68FD7 #B5A0DA #B3B1DD #B2C1E0 #B0D2E3 #AFE3E6

#B87FD4 - #AFE3E6

HSV Blend

#B87FD4 - #AFE3E6 | 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 #B87FD4 as 0% and #AFE3E6 as 100%.

0.0%	0.0% #B87FD4	RGB 184 127 212	#B87FD4
16.7%	16.7% #A686D7	RGB 166 134 215	#A686D7
33.3%	33.3% #988EDA	RGB 152 142 218	#988EDA
50.0%	50.0% #969FDD	RGB 150 159 221	#969FDD
66.7%	66.7% #9EB9E0	RGB 158 185 224	#9EB9E0
83.3%	83.3% #A6CFE3	RGB 166 207 227	#A6CFE3
100.0%	100.0% #AFE3E6	RGB 175 227 230	#AFE3E6

#B87FD4 #A686D7 #988EDA #969FDD #9EB9E0 #A6CFE3 #AFE3E6

#B87FD4 - #969FDD - #AFE3E6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B87FD4 0%, #969FDD 50%, #AFE3E6 100%);
    background: -webkit-linear-gradient(top, #B87FD4 0%, #969FDD 50%, #AFE3E6 100%);
    background: linear-gradient(to bottom, #B87FD4 0%, #969FDD 50%, #AFE3E6 100%);
}
</style>