#552222 - #AE5E46 | 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 #552222 to #AE5E46

#552222 #AE5E46

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

#552222 - #AE5E46 | 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 #552222 as 0% and #AE5E46 as 100%.

0.0%	0.0% #552222	RGB 85 34 34	#552222
16.7%	16.7% #632C28	RGB 99 44 40	#632C28
33.3%	33.3% #72362E	RGB 114 54 46	#72362E
50.0%	50.0% #814034	RGB 129 64 52	#814034
66.7%	66.7% #904A3A	RGB 144 74 58	#904A3A
83.3%	83.3% #9F5440	RGB 159 84 64	#9F5440
100.0%	100.0% #AE5E46	RGB 174 94 70	#AE5E46

#552222 #632C28 #72362E #814034 #904A3A #9F5440 #AE5E46

#552222 - #AE5E46

HSV Blend

#552222 - #AE5E46 | 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 #552222 as 0% and #AE5E46 as 100%.

0.0%	0.0% #552222	RGB 85 34 34	#552222
16.7%	16.7% #632A27	RGB 99 42 39	#632A27
33.3%	33.3% #72332D	RGB 114 51 45	#72332D
50.0%	50.0% #813C33	RGB 129 60 51	#813C33
66.7%	66.7% #904739	RGB 144 71 57	#904739
83.3%	83.3% #9F523F	RGB 159 82 63	#9F523F
100.0%	100.0% #AE5E46	RGB 174 94 70	#AE5E46

#552222 #632A27 #72332D #813C33 #904739 #9F523F #AE5E46

#552222 - #813C33 - #AE5E46

CSS codes

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

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