#DF3CD9 - #FAC2FF | 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 #DF3CD9 to #FAC2FF

#DF3CD9 #FAC2FF

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

#DF3CD9 - #FAC2FF | 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 #DF3CD9 as 0% and #FAC2FF as 100%.

0.0%	0.0% #DF3CD9	RGB 223 60 217	#DF3CD9
16.7%	16.7% #E352DF	RGB 227 82 223	#E352DF
33.3%	33.3% #E868E5	RGB 232 104 229	#E868E5
50.0%	50.0% #EC7FEC	RGB 236 127 236	#EC7FEC
66.7%	66.7% #F195F2	RGB 241 149 242	#F195F2
83.3%	83.3% #F5ABF8	RGB 245 171 248	#F5ABF8
100.0%	100.0% #FAC2FF	RGB 250 194 255	#FAC2FF

#DF3CD9 #E352DF #E868E5 #EC7FEC #F195F2 #F5ABF8 #FAC2FF

#DF3CD9 - #FAC2FF

HSV Blend

#DF3CD9 - #FAC2FF | 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 #DF3CD9 as 0% and #FAC2FF as 100%.

0.0%	0.0% #DF3CD9	RGB 223 60 217	#DF3CD9
16.7%	16.7% #E450E1	RGB 228 80 225	#E450E1
33.3%	33.3% #E965E9	RGB 233 101 233	#E965E9
50.0%	50.0% #EC7BEF	RGB 236 123 239	#EC7BEF
66.7%	66.7% #F091F4	RGB 240 145 244	#F091F4
83.3%	83.3% #F4A9F9	RGB 244 169 249	#F4A9F9
100.0%	100.0% #FAC2FF	RGB 250 194 255	#FAC2FF

#DF3CD9 #E450E1 #E965E9 #EC7BEF #F091F4 #F4A9F9 #FAC2FF

#DF3CD9 - #EC7BEF - #FAC2FF

CSS codes

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

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