#7ECBC2 - #DAF0EC | 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 #7ECBC2 to #DAF0EC

#7ECBC2 #DAF0EC

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

#7ECBC2 - #DAF0EC | 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 #7ECBC2 as 0% and #DAF0EC as 100%.

0.0%	0.0% #7ECBC2	RGB 126 203 194	#7ECBC2
16.7%	16.7% #8DD1C9	RGB 141 209 201	#8DD1C9
33.3%	33.3% #9CD7D0	RGB 156 215 208	#9CD7D0
50.0%	50.0% #ACDDD7	RGB 172 221 215	#ACDDD7
66.7%	66.7% #BBE3DE	RGB 187 227 222	#BBE3DE
83.3%	83.3% #CAE9E5	RGB 202 233 229	#CAE9E5
100.0%	100.0% #DAF0EC	RGB 218 240 236	#DAF0EC

#7ECBC2 #8DD1C9 #9CD7D0 #ACDDD7 #BBE3DE #CAE9E5 #DAF0EC

#7ECBC2 - #DAF0EC

HSV Blend

#7ECBC2 - #DAF0EC | 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 #7ECBC2 as 0% and #DAF0EC as 100%.

0.0%	0.0% #7ECBC2	RGB 126 203 194	#7ECBC2
16.7%	16.7% #8BD1C8	RGB 139 209 200	#8BD1C8
33.3%	33.3% #9AD7CE	RGB 154 215 206	#9AD7CE
50.0%	50.0% #A9DDD5	RGB 169 221 213	#A9DDD5
66.7%	66.7% #B8E3DC	RGB 184 227 220	#B8E3DC
83.3%	83.3% #C9E9E4	RGB 201 233 228	#C9E9E4
100.0%	100.0% #DAF0EC	RGB 218 240 236	#DAF0EC

#7ECBC2 #8BD1C8 #9AD7CE #A9DDD5 #B8E3DC #C9E9E4 #DAF0EC

#7ECBC2 - #A9DDD5 - #DAF0EC

CSS codes

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

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