#552200 - #AF5E5F | 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 #552200 to #AF5E5F

#552200 #AF5E5F

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

#552200 - #AF5E5F | 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 #552200 as 0% and #AF5E5F as 100%.

0.0%	0.0% #552200	RGB 85 34 0	#552200
16.7%	16.7% #642C0F	RGB 100 44 15	#642C0F
33.3%	33.3% #73361F	RGB 115 54 31	#73361F
50.0%	50.0% #82402F	RGB 130 64 47	#82402F
66.7%	66.7% #914A3F	RGB 145 74 63	#914A3F
83.3%	83.3% #A0544F	RGB 160 84 79	#A0544F
100.0%	100.0% #AF5E5F	RGB 175 94 95	#AF5E5F

#552200 #642C0F #73361F #82402F #914A3F #A0544F #AF5E5F

#552200 - #AF5E5F

HSV Blend

#552200 - #AF5E5F | 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 #552200 as 0% and #AF5E5F as 100%.

0.0%	0.0% #552200	RGB 85 34 0	#552200
16.7%	16.7% #642708	RGB 100 39 8	#642708
33.3%	33.3% #732D14	RGB 115 45 20	#732D14
50.0%	50.0% #823522	RGB 130 53 34	#823522
66.7%	66.7% #913F33	RGB 145 63 51	#913F33
83.3%	83.3% #A04C47	RGB 160 76 71	#A04C47
100.0%	100.0% #AF5E5F	RGB 175 94 95	#AF5E5F

#552200 #642708 #732D14 #823522 #913F33 #A04C47 #AF5E5F

#552200 - #823522 - #AF5E5F

CSS codes

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

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