#FF3BAA - #FFBED1 | 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 #FF3BAA to #FFBED1

#FF3BAA #FFBED1

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

#FF3BAA - #FFBED1 | 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 #FF3BAA as 0% and #FFBED1 as 100%.

0.0%	0.0% #FF3BAA	RGB 255 59 170	#FF3BAA
16.7%	16.7% #FF50B0	RGB 255 80 176	#FF50B0
33.3%	33.3% #FF66B7	RGB 255 102 183	#FF66B7
50.0%	50.0% #FF7CBD	RGB 255 124 189	#FF7CBD
66.7%	66.7% #FF92C4	RGB 255 146 196	#FF92C4
83.3%	83.3% #FFA8CA	RGB 255 168 202	#FFA8CA
100.0%	100.0% #FFBED1	RGB 255 190 209	#FFBED1

#FF3BAA #FF50B0 #FF66B7 #FF7CBD #FF92C4 #FFA8CA #FFBED1

#FF3BAA - #FFBED1

HSV Blend

#FF3BAA - #FFBED1 | 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 #FF3BAA as 0% and #FFBED1 as 100%.

0.0%	0.0% #FF3BAA	RGB 255 59 170	#FF3BAA
16.7%	16.7% #FF50AB	RGB 255 80 171	#FF50AB
33.3%	33.3% #FF66AF	RGB 255 102 175	#FF66AF
50.0%	50.0% #FF7CB4	RGB 255 124 180	#FF7CB4
66.7%	66.7% #FF92BC	RGB 255 146 188	#FF92BC
83.3%	83.3% #FFA8C5	RGB 255 168 197	#FFA8C5
100.0%	100.0% #FFBED1	RGB 255 190 209	#FFBED1

#FF3BAA #FF50AB #FF66AF #FF7CB4 #FF92BC #FFA8C5 #FFBED1

#FF3BAA - #FF7CB4 - #FFBED1

CSS codes

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

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