#DD4D4F - #FFA158 | 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 #DD4D4F to #FFA158

#DD4D4F #FFA158

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

#DD4D4F - #FFA158 | 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 #DD4D4F as 0% and #FFA158 as 100%.

0.0%	0.0% #DD4D4F	RGB 221 77 79	#DD4D4F
16.7%	16.7% #E25B50	RGB 226 91 80	#E25B50
33.3%	33.3% #E86952	RGB 232 105 82	#E86952
50.0%	50.0% #EE7753	RGB 238 119 83	#EE7753
66.7%	66.7% #F38555	RGB 243 133 85	#F38555
83.3%	83.3% #F99356	RGB 249 147 86	#F99356
100.0%	100.0% #FFA158	RGB 255 161 88	#FFA158

#DD4D4F #E25B50 #E86952 #EE7753 #F38555 #F99356 #FFA158

#DD4D4F - #FFA158

HSV Blend

#DD4D4F - #FFA158 | 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 #DD4D4F as 0% and #FFA158 as 100%.

0.0%	0.0% #DD4D4E	RGB 221 77 78	#DD4D4E
16.7%	16.7% #E2574E	RGB 226 87 78	#E2574E
33.3%	33.3% #E86550	RGB 232 101 80	#E86550
50.0%	50.0% #EE7352	RGB 238 115 82	#EE7352
66.7%	66.7% #F38254	RGB 243 130 84	#F38254
83.3%	83.3% #F99156	RGB 249 145 86	#F99156
100.0%	100.0% #FFA158	RGB 255 161 88	#FFA158

#DD4D4E #E2574E #E86550 #EE7352 #F38254 #F99156 #FFA158

#DD4D4F - #EE7352 - #FFA158

CSS codes

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

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