#502A8C - #22002B | 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 #502A8C to #22002B

#502A8C #22002B

Calculate the color between two colors, #502A8C and #22002B. 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)

#502A8C - #22002B | 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 #502A8C as 0% and #22002B as 100%.

0.0%	0.0% #502A8C	RGB 80 42 140	#502A8C
16.7%	16.7% #48237B	RGB 72 35 123	#48237B
33.3%	33.3% #401C6B	RGB 64 28 107	#401C6B
50.0%	50.0% #39155B	RGB 57 21 91	#39155B
66.7%	66.7% #310D4B	RGB 49 13 75	#310D4B
83.3%	83.3% #29073B	RGB 41 7 59	#29073B
100.0%	100.0% #22002B	RGB 34 0 43	#22002B

#502A8C #48237B #401C6B #39155B #310D4B #29073B #22002B

#502A8C - #22002B

HSV Blend

#502A8C - #22002B | 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 #502A8C as 0% and #22002B as 100%.

0.0%	0.0% #4F2A8C	RGB 79 42 140	#4F2A8C
16.7%	16.7% #491E7B	RGB 73 30 123	#491E7B
33.3%	33.3% #42156B	RGB 66 21 107	#42156B
50.0%	50.0% #3B0D5B	RGB 59 13 91	#3B0D5B
66.7%	66.7% #34074B	RGB 52 7 75	#34074B
83.3%	83.3% #2B023B	RGB 43 2 59	#2B023B
100.0%	100.0% #22002B	RGB 34 0 43	#22002B

#4F2A8C #491E7B #42156B #3B0D5B #34074B #2B023B #22002B

#502A8C - #3B0D5B - #22002B

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4F2A8C 0%, #3B0D5B 50%, #22002B 100%);
    background: -webkit-linear-gradient(top, #4F2A8C 0%, #3B0D5B 50%, #22002B 100%);
    background: linear-gradient(to bottom, #4F2A8C 0%, #3B0D5B 50%, #22002B 100%);
}
</style>