#FF0CF3 - #FFBAFA | 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 #FF0CF3 to #FFBAFA

#FF0CF3 #FFBAFA

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

#FF0CF3 - #FFBAFA | 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 #FF0CF3 as 0% and #FFBAFA as 100%.

0.0%	0.0% #FF0CF3	RGB 255 12 243	#FF0CF3
16.7%	16.7% #FF29F4	RGB 255 41 244	#FF29F4
33.3%	33.3% #FF46F5	RGB 255 70 245	#FF46F5
50.0%	50.0% #FF63F6	RGB 255 99 246	#FF63F6
66.7%	66.7% #FF80F7	RGB 255 128 247	#FF80F7
83.3%	83.3% #FF9DF8	RGB 255 157 248	#FF9DF8
100.0%	100.0% #FFBAFA	RGB 255 186 250	#FFBAFA

#FF0CF3 #FF29F4 #FF46F5 #FF63F6 #FF80F7 #FF9DF8 #FFBAFA

#FF0CF3 - #FFBAFA

HSV Blend

#FF0CF3 - #FFBAFA | 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 #FF0CF3 as 0% and #FFBAFA as 100%.

0.0%	0.0% #FF0BF3	RGB 255 11 243	#FF0BF3
16.7%	16.7% #FF28F3	RGB 255 40 243	#FF28F3
33.3%	33.3% #FF45F4	RGB 255 69 244	#FF45F4
50.0%	50.0% #FF63F5	RGB 255 99 245	#FF63F5
66.7%	66.7% #FF80F6	RGB 255 128 246	#FF80F6
83.3%	83.3% #FF9DF8	RGB 255 157 248	#FF9DF8
100.0%	100.0% #FFBAFA	RGB 255 186 250	#FFBAFA

#FF0BF3 #FF28F3 #FF45F4 #FF63F5 #FF80F6 #FF9DF8 #FFBAFA

#FF0CF3 - #FF63F5 - #FFBAFA

CSS codes

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

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