#BB7EC2 - #FF9DF4 | 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 #BB7EC2 to #FF9DF4

#BB7EC2 #FF9DF4

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

#BB7EC2 - #FF9DF4 | 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 #BB7EC2 as 0% and #FF9DF4 as 100%.

0.0%	0.0% #BB7EC2	RGB 187 126 194	#BB7EC2
16.7%	16.7% #C683CA	RGB 198 131 202	#C683CA
33.3%	33.3% #D188D2	RGB 209 136 210	#D188D2
50.0%	50.0% #DD8DDB	RGB 221 141 219	#DD8DDB
66.7%	66.7% #E892E3	RGB 232 146 227	#E892E3
83.3%	83.3% #F397EB	RGB 243 151 235	#F397EB
100.0%	100.0% #FF9DF4	RGB 255 157 244	#FF9DF4

#BB7EC2 #C683CA #D188D2 #DD8DDB #E892E3 #F397EB #FF9DF4

#BB7EC2 - #FF9DF4

HSV Blend

#BB7EC2 - #FF9DF4 | 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 #BB7EC2 as 0% and #FF9DF4 as 100%.

0.0%	0.0% #BA7EC2	RGB 186 126 194	#BA7EC2
16.7%	16.7% #C783CC	RGB 199 131 204	#C783CC
33.3%	33.3% #D388D6	RGB 211 136 214	#D388D6
50.0%	50.0% #E08EE0	RGB 224 142 224	#E08EE0
66.7%	66.7% #EA93E7	RGB 234 147 231	#EA93E7
83.3%	83.3% #F498ED	RGB 244 152 237	#F498ED
100.0%	100.0% #FF9DF4	RGB 255 157 244	#FF9DF4

#BA7EC2 #C783CC #D388D6 #E08EE0 #EA93E7 #F498ED #FF9DF4

#BB7EC2 - #E08EE0 - #FF9DF4

CSS codes

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

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