#AA3C7E - #F55380 | 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 #AA3C7E to #F55380

#AA3C7E #F55380

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

#AA3C7E - #F55380 | 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 #AA3C7E as 0% and #F55380 as 100%.

0.0%	0.0% #AA3C7E	RGB 170 60 126	#AA3C7E
16.7%	16.7% #B63F7E	RGB 182 63 126	#B63F7E
33.3%	33.3% #C3437E	RGB 195 67 126	#C3437E
50.0%	50.0% #CF477F	RGB 207 71 127	#CF477F
66.7%	66.7% #DC4B7F	RGB 220 75 127	#DC4B7F
83.3%	83.3% #E84F7F	RGB 232 79 127	#E84F7F
100.0%	100.0% #F55380	RGB 245 83 128	#F55380

#AA3C7E #B63F7E #C3437E #CF477F #DC4B7F #E84F7F #F55380

#AA3C7E - #F55380

HSV Blend

#AA3C7E - #F55380 | 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 #AA3C7E as 0% and #F55380 as 100%.

0.0%	0.0% #AA3C7E	RGB 170 60 126	#AA3C7E
16.7%	16.7% #B63F80	RGB 182 63 128	#B63F80
33.3%	33.3% #C34382	RGB 195 67 130	#C34382
50.0%	50.0% #CF4783	RGB 207 71 131	#CF4783
66.7%	66.7% #DC4B83	RGB 220 75 131	#DC4B83
83.3%	83.3% #E84F82	RGB 232 79 130	#E84F82
100.0%	100.0% #F55380	RGB 245 83 128	#F55380

#AA3C7E #B63F80 #C34382 #CF4783 #DC4B83 #E84F82 #F55380

#AA3C7E - #CF4783 - #F55380

CSS codes

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

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