#2DBCD1 - #D4EFD3 | 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 #2DBCD1 to #D4EFD3

#2DBCD1 #D4EFD3

Calculate the color between two colors, #2DBCD1 and #D4EFD3. 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)

#2DBCD1 - #D4EFD3 | 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 #2DBCD1 as 0% and #D4EFD3 as 100%.

0.0%	0.0% #2DBCD1	RGB 45 188 209	#2DBCD1
16.7%	16.7% #48C4D1	RGB 72 196 209	#48C4D1
33.3%	33.3% #64CDD1	RGB 100 205 209	#64CDD1
50.0%	50.0% #80D5D2	RGB 128 213 210	#80D5D2
66.7%	66.7% #9CDED2	RGB 156 222 210	#9CDED2
83.3%	83.3% #B8E6D2	RGB 184 230 210	#B8E6D2
100.0%	100.0% #D4EFD3	RGB 212 239 211	#D4EFD3

#2DBCD1 #48C4D1 #64CDD1 #80D5D2 #9CDED2 #B8E6D2 #D4EFD3

#2DBCD1 - #D4EFD3

HSV Blend

#2DBCD1 - #D4EFD3 | 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 #2DBCD1 as 0% and #D4EFD3 as 100%.

0.0%	0.0% #2DBBD1	RGB 45 187 209	#2DBBD1
16.7%	16.7% #45D6CC	RGB 69 214 204	#45D6CC
33.3%	33.3% #5FDBBB	RGB 95 219 187	#5FDBBB
50.0%	50.0% #7AE0B2	RGB 122 224 178	#7AE0B2
66.7%	66.7% #97E5B2	RGB 151 229 178	#97E5B2
83.3%	83.3% #B4EABD	RGB 180 234 189	#B4EABD
100.0%	100.0% #D4EFD3	RGB 212 239 211	#D4EFD3

#2DBBD1 #45D6CC #5FDBBB #7AE0B2 #97E5B2 #B4EABD #D4EFD3

#2DBCD1 - #7AE0B2 - #D4EFD3

CSS codes

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

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