#AFEB9C - #FFF0B0 | 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 #AFEB9C to #FFF0B0

#AFEB9C #FFF0B0

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

#AFEB9C - #FFF0B0 | 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 #AFEB9C as 0% and #FFF0B0 as 100%.

0.0%	0.0% #AFEB9C	RGB 175 235 156	#AFEB9C
16.7%	16.7% #BCEB9F	RGB 188 235 159	#BCEB9F
33.3%	33.3% #C9ECA2	RGB 201 236 162	#C9ECA2
50.0%	50.0% #D7EDA6	RGB 215 237 166	#D7EDA6
66.7%	66.7% #E4EEA9	RGB 228 238 169	#E4EEA9
83.3%	83.3% #F1EFAC	RGB 241 239 172	#F1EFAC
100.0%	100.0% #FFF0B0	RGB 255 240 176	#FFF0B0

#AFEB9C #BCEB9F #C9ECA2 #D7EDA6 #E4EEA9 #F1EFAC #FFF0B0

#AFEB9C - #FFF0B0

HSV Blend

#AFEB9C - #FFF0B0 | 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 #AFEB9C as 0% and #FFF0B0 as 100%.

0.0%	0.0% #AFEB9C	RGB 175 235 156	#AFEB9C
16.7%	16.7% #BEEE9F	RGB 190 238 159	#BEEE9F
33.3%	33.3% #CEF1A2	RGB 206 241 162	#CEF1A2
50.0%	50.0% #DEF5A5	RGB 222 245 165	#DEF5A5
66.7%	66.7% #EEF8A9	RGB 238 248 169	#EEF8A9
83.3%	83.3% #FBF9AC	RGB 251 249 172	#FBF9AC
100.0%	100.0% #FFF0B0	RGB 255 240 176	#FFF0B0

#AFEB9C #BEEE9F #CEF1A2 #DEF5A5 #EEF8A9 #FBF9AC #FFF0B0

#AFEB9C - #DEF5A5 - #FFF0B0

CSS codes

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

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