#FFBAFE - #F661EC | 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 #FFBAFE to #F661EC

#FFBAFE #F661EC

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

#FFBAFE - #F661EC | 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 #FFBAFE as 0% and #F661EC as 100%.

0.0%	0.0% #FFBAFE	RGB 255 186 254	#FFBAFE
16.7%	16.7% #FDABFB	RGB 253 171 251	#FDABFB
33.3%	33.3% #FC9CF8	RGB 252 156 248	#FC9CF8
50.0%	50.0% #FA8DF5	RGB 250 141 245	#FA8DF5
66.7%	66.7% #F97EF2	RGB 249 126 242	#F97EF2
83.3%	83.3% #F76FEF	RGB 247 111 239	#F76FEF
100.0%	100.0% #F661EC	RGB 246 97 236	#F661EC

#FFBAFE #FDABFB #FC9CF8 #FA8DF5 #F97EF2 #F76FEF #F661EC

#FFBAFE - #F661EC

HSV Blend

#FFBAFE - #F661EC | 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 #FFBAFE as 0% and #F661EC as 100%.

0.0%	0.0% #FFBAFE	RGB 255 186 254	#FFBAFE
16.7%	16.7% #FDAAFB	RGB 253 170 251	#FDAAFB
33.3%	33.3% #FC9BF8	RGB 252 155 248	#FC9BF8
50.0%	50.0% #FA8CF6	RGB 250 140 246	#FA8CF6
66.7%	66.7% #F97DF2	RGB 249 125 242	#F97DF2
83.3%	83.3% #F76FEF	RGB 247 111 239	#F76FEF
100.0%	100.0% #F661EC	RGB 246 97 236	#F661EC

#FFBAFE #FDAAFB #FC9BF8 #FA8CF6 #F97DF2 #F76FEF #F661EC

#FFBAFE - #FA8CF6 - #F661EC

CSS codes

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

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