#AFF5E3 - #40D3BC | 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 #AFF5E3 to #40D3BC

#AFF5E3 #40D3BC

Calculate the color between two colors, #AFF5E3 and #40D3BC. 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)

#AFF5E3 - #40D3BC | 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 #AFF5E3 as 0% and #40D3BC as 100%.

0.0%	0.0% #AFF5E3	RGB 175 245 227	#AFF5E3
16.7%	16.7% #9CEFDC	RGB 156 239 220	#9CEFDC
33.3%	33.3% #8AE9D6	RGB 138 233 214	#8AE9D6
50.0%	50.0% #77E4CF	RGB 119 228 207	#77E4CF
66.7%	66.7% #65DEC9	RGB 101 222 201	#65DEC9
83.3%	83.3% #52D8C2	RGB 82 216 194	#52D8C2
100.0%	100.0% #40D3BC	RGB 64 211 188	#40D3BC

#AFF5E3 #9CEFDC #8AE9D6 #77E4CF #65DEC9 #52D8C2 #40D3BC

#AFF5E3 - #40D3BC

HSV Blend

#AFF5E3 - #40D3BC | 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 #AFF5E3 as 0% and #40D3BC as 100%.

0.0%	0.0% #AFF5E3	RGB 175 245 227	#AFF5E3
16.7%	16.7% #9AEFDA	RGB 154 239 218	#9AEFDA
33.3%	33.3% #86E9D3	RGB 134 233 211	#86E9D3
50.0%	50.0% #74E4CC	RGB 116 228 204	#74E4CC
66.7%	66.7% #61DEC6	RGB 97 222 198	#61DEC6
83.3%	83.3% #50D8C1	RGB 80 216 193	#50D8C1
100.0%	100.0% #40D3BC	RGB 64 211 188	#40D3BC

#AFF5E3 #9AEFDA #86E9D3 #74E4CC #61DEC6 #50D8C1 #40D3BC

#AFF5E3 - #74E4CC - #40D3BC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AFF5E3 0%, #74E4CC 50%, #40D3BC 100%);
    background: -webkit-linear-gradient(top, #AFF5E3 0%, #74E4CC 50%, #40D3BC 100%);
    background: linear-gradient(to bottom, #AFF5E3 0%, #74E4CC 50%, #40D3BC 100%);
}
</style>