#FF536C - #FFBA7E | 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 #FF536C to #FFBA7E

#FF536C #FFBA7E

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

#FF536C - #FFBA7E | 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 #FF536C as 0% and #FFBA7E as 100%.

0.0%	0.0% #FF536C	RGB 255 83 108	#FF536C
16.7%	16.7% #FF646F	RGB 255 100 111	#FF646F
33.3%	33.3% #FF7572	RGB 255 117 114	#FF7572
50.0%	50.0% #FF8675	RGB 255 134 117	#FF8675
66.7%	66.7% #FF9778	RGB 255 151 120	#FF9778
83.3%	83.3% #FFA87B	RGB 255 168 123	#FFA87B
100.0%	100.0% #FFBA7E	RGB 255 186 126	#FFBA7E

#FF536C #FF646F #FF7572 #FF8675 #FF9778 #FFA87B #FFBA7E

#FF536C - #FFBA7E

HSV Blend

#FF536C - #FFBA7E | 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 #FF536C as 0% and #FFBA7E as 100%.

0.0%	0.0% #FF536C	RGB 255 83 108	#FF536C
16.7%	16.7% #FF5A61	RGB 255 90 97	#FF5A61
33.3%	33.3% #FF6A61	RGB 255 106 97	#FF6A61
50.0%	50.0% #FF8068	RGB 255 128 104	#FF8068
66.7%	66.7% #FF956F	RGB 255 149 111	#FF956F
83.3%	83.3% #FFA876	RGB 255 168 118	#FFA876
100.0%	100.0% #FFBA7E	RGB 255 186 126	#FFBA7E

#FF536C #FF5A61 #FF6A61 #FF8068 #FF956F #FFA876 #FFBA7E

#FF536C - #FF8068 - #FFBA7E

CSS codes

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

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