#AF3CA1 - #FB6FA7 | 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 #AF3CA1 to #FB6FA7

#AF3CA1 #FB6FA7

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

#AF3CA1 - #FB6FA7 | 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 #AF3CA1 as 0% and #FB6FA7 as 100%.

0.0%	0.0% #AF3CA1	RGB 175 60 161	#AF3CA1
16.7%	16.7% #BB44A2	RGB 187 68 162	#BB44A2
33.3%	33.3% #C84DA3	RGB 200 77 163	#C84DA3
50.0%	50.0% #D555A4	RGB 213 85 164	#D555A4
66.7%	66.7% #E15EA5	RGB 225 94 165	#E15EA5
83.3%	83.3% #EE66A6	RGB 238 102 166	#EE66A6
100.0%	100.0% #FB6FA7	RGB 251 111 167	#FB6FA7

#AF3CA1 #BB44A2 #C84DA3 #D555A4 #E15EA5 #EE66A6 #FB6FA7

#AF3CA1 - #FB6FA7

HSV Blend

#AF3CA1 - #FB6FA7 | 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 #AF3CA1 as 0% and #FB6FA7 as 100%.

0.0%	0.0% #AF3CA0	RGB 175 60 160	#AF3CA0
16.7%	16.7% #BB43A3	RGB 187 67 163	#BB43A3
33.3%	33.3% #C84BA5	RGB 200 75 165	#C84BA5
50.0%	50.0% #D553A6	RGB 213 83 166	#D553A6
66.7%	66.7% #E15CA6	RGB 225 92 166	#E15CA6
83.3%	83.3% #EE65A7	RGB 238 101 167	#EE65A7
100.0%	100.0% #FB6FA7	RGB 251 111 167	#FB6FA7

#AF3CA0 #BB43A3 #C84BA5 #D553A6 #E15CA6 #EE65A7 #FB6FA7

#AF3CA1 - #D553A6 - #FB6FA7

CSS codes

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

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