#B22C5E - #5A011F | 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 #B22C5E to #5A011F

#B22C5E #5A011F

Calculate the color between two colors, #B22C5E and #5A011F. 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)

#B22C5E - #5A011F | 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 #B22C5E as 0% and #5A011F as 100%.

0.0%	0.0% #B22C5E	RGB 178 44 94	#B22C5E
16.7%	16.7% #A32453	RGB 163 36 83	#A32453
33.3%	33.3% #941D49	RGB 148 29 73	#941D49
50.0%	50.0% #86163E	RGB 134 22 62	#86163E
66.7%	66.7% #770F34	RGB 119 15 52	#770F34
83.3%	83.3% #680829	RGB 104 8 41	#680829
100.0%	100.0% #5A011F	RGB 90 1 31	#5A011F

#B22C5E #A32453 #941D49 #86163E #770F34 #680829 #5A011F

#B22C5E - #5A011F

HSV Blend

#B22C5E - #5A011F | 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 #B22C5E as 0% and #5A011F as 100%.

0.0%	0.0% #B22C5D	RGB 178 44 93	#B22C5D
16.7%	16.7% #A32151	RGB 163 33 81	#A32151
33.3%	33.3% #941945	RGB 148 25 69	#941945
50.0%	50.0% #86113A	RGB 134 17 58	#86113A
66.7%	66.7% #770A30	RGB 119 10 48	#770A30
83.3%	83.3% #680527	RGB 104 5 39	#680527
100.0%	100.0% #5A011F	RGB 90 1 31	#5A011F

#B22C5D #A32151 #941945 #86113A #770A30 #680527 #5A011F

#B22C5E - #86113A - #5A011F

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B22C5D 0%, #86113A 50%, #5A011F 100%);
    background: -webkit-linear-gradient(top, #B22C5D 0%, #86113A 50%, #5A011F 100%);
    background: linear-gradient(to bottom, #B22C5D 0%, #86113A 50%, #5A011F 100%);
}
</style>