#DEFFC2 - #AAE96B | 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 #DEFFC2 to #AAE96B

#DEFFC2 #AAE96B

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

#DEFFC2 - #AAE96B | 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 #DEFFC2 as 0% and #AAE96B as 100%.

0.0%	0.0% #DEFFC2	RGB 222 255 194	#DEFFC2
16.7%	16.7% #D5FBB3	RGB 213 251 179	#D5FBB3
33.3%	33.3% #CCF7A5	RGB 204 247 165	#CCF7A5
50.0%	50.0% #C4F496	RGB 196 244 150	#C4F496
66.7%	66.7% #BBF088	RGB 187 240 136	#BBF088
83.3%	83.3% #B2EC79	RGB 178 236 121	#B2EC79
100.0%	100.0% #AAE96B	RGB 170 233 107	#AAE96B

#DEFFC2 #D5FBB3 #CCF7A5 #C4F496 #BBF088 #B2EC79 #AAE96B

#DEFFC2 - #AAE96B

HSV Blend

#DEFFC2 - #AAE96B | 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 #DEFFC2 as 0% and #AAE96B as 100%.

0.0%	0.0% #DEFFC2	RGB 222 255 194	#DEFFC2
16.7%	16.7% #D4FBB2	RGB 212 251 178	#D4FBB2
33.3%	33.3% #CBF7A3	RGB 203 247 163	#CBF7A3
50.0%	50.0% #C2F494	RGB 194 244 148	#C2F494
66.7%	66.7% #B9F086	RGB 185 240 134	#B9F086
83.3%	83.3% #B1EC78	RGB 177 236 120	#B1EC78
100.0%	100.0% #AAE96B	RGB 170 233 107	#AAE96B

#DEFFC2 #D4FBB2 #CBF7A3 #C2F494 #B9F086 #B1EC78 #AAE96B

#DEFFC2 - #C2F494 - #AAE96B

CSS codes

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

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