#AF3DA2 - #FB71A8 | 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 #AF3DA2 to #FB71A8

#AF3DA2 #FB71A8

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

#AF3DA2 - #FB71A8 | 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 #AF3DA2 as 0% and #FB71A8 as 100%.

0.0%	0.0% #AF3DA2	RGB 175 61 162	#AF3DA2
16.7%	16.7% #BB45A3	RGB 187 69 163	#BB45A3
33.3%	33.3% #C84EA4	RGB 200 78 164	#C84EA4
50.0%	50.0% #D557A5	RGB 213 87 165	#D557A5
66.7%	66.7% #E15FA6	RGB 225 95 166	#E15FA6
83.3%	83.3% #EE68A7	RGB 238 104 167	#EE68A7
100.0%	100.0% #FB71A8	RGB 251 113 168	#FB71A8

#AF3DA2 #BB45A3 #C84EA4 #D557A5 #E15FA6 #EE68A7 #FB71A8

#AF3DA2 - #FB71A8

HSV Blend

#AF3DA2 - #FB71A8 | 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 #AF3DA2 as 0% and #FB71A8 as 100%.

0.0%	0.0% #AF3DA1	RGB 175 61 161	#AF3DA1
16.7%	16.7% #BB44A4	RGB 187 68 164	#BB44A4
33.3%	33.3% #C84CA6	RGB 200 76 166	#C84CA6
50.0%	50.0% #D555A7	RGB 213 85 167	#D555A7
66.7%	66.7% #E15DA7	RGB 225 93 167	#E15DA7
83.3%	83.3% #EE67A8	RGB 238 103 168	#EE67A8
100.0%	100.0% #FB71A8	RGB 251 113 168	#FB71A8

#AF3DA1 #BB44A4 #C84CA6 #D555A7 #E15DA7 #EE67A8 #FB71A8

#AF3DA2 - #D555A7 - #FB71A8

CSS codes

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

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