#00DFE3 - #00AB41 | 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 #00DFE3 to #00AB41

#00DFE3 #00AB41

Calculate the color between two colors, #00DFE3 and #00AB41. 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)

#00DFE3 - #00AB41 | 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 #00DFE3 as 0% and #00AB41 as 100%.

0.0%	0.0% #00DFE3	RGB 0 223 227	#00DFE3
16.7%	16.7% #00D6C8	RGB 0 214 200	#00D6C8
33.3%	33.3% #00CDAD	RGB 0 205 173	#00CDAD
50.0%	50.0% #00C592	RGB 0 197 146	#00C592
66.7%	66.7% #00BC77	RGB 0 188 119	#00BC77
83.3%	83.3% #00B35C	RGB 0 179 92	#00B35C
100.0%	100.0% #00AB41	RGB 0 171 65	#00AB41

#00DFE3 #00D6C8 #00CDAD #00C592 #00BC77 #00B35C #00AB41

#00DFE3 - #00AB41

HSV Blend

#00DFE3 - #00AB41 | 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 #00DFE3 as 0% and #00AB41 as 100%.

0.0%	0.0% #00DFE3	RGB 0 223 227	#00DFE3
16.7%	16.7% #00D9C6	RGB 0 217 198	#00D9C6
33.3%	33.3% #00D0A7	RGB 0 208 167	#00D0A7
50.0%	50.0% #00C78B	RGB 0 199 139	#00C78B
66.7%	66.7% #00BD70	RGB 0 189 112	#00BD70
83.3%	83.3% #00B457	RGB 0 180 87	#00B457
100.0%	100.0% #00AB41	RGB 0 171 65	#00AB41

#00DFE3 #00D9C6 #00D0A7 #00C78B #00BD70 #00B457 #00AB41

#00DFE3 - #00C78B - #00AB41

CSS codes

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

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