#DFF4F1 - #CFEDEC | 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 #DFF4F1 to #CFEDEC

#DFF4F1 #CFEDEC

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

#DFF4F1 - #CFEDEC | 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 #DFF4F1 as 0% and #CFEDEC as 100%.

0.0%	0.0% #DFF4F1	RGB 223 244 241	#DFF4F1
16.7%	16.7% #DCF2F0	RGB 220 242 240	#DCF2F0
33.3%	33.3% #D9F1EF	RGB 217 241 239	#D9F1EF
50.0%	50.0% #D7F0EE	RGB 215 240 238	#D7F0EE
66.7%	66.7% #D4EFED	RGB 212 239 237	#D4EFED
83.3%	83.3% #D1EEEC	RGB 209 238 236	#D1EEEC
100.0%	100.0% #CFEDEC	RGB 207 237 236	#CFEDEC

#DFF4F1 #DCF2F0 #D9F1EF #D7F0EE #D4EFED #D1EEEC #CFEDEC

#DFF4F1 - #CFEDEC

HSV Blend

#DFF4F1 - #CFEDEC | 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 #DFF4F1 as 0% and #CFEDEC as 100%.

0.0%	0.0% #DFF4F1	RGB 223 244 241	#DFF4F1
16.7%	16.7% #DCF2F0	RGB 220 242 240	#DCF2F0
33.3%	33.3% #D9F1EF	RGB 217 241 239	#D9F1EF
50.0%	50.0% #D6F0EE	RGB 214 240 238	#D6F0EE
66.7%	66.7% #D4EFED	RGB 212 239 237	#D4EFED
83.3%	83.3% #D1EEEC	RGB 209 238 236	#D1EEEC
100.0%	100.0% #CFEDEC	RGB 207 237 236	#CFEDEC

#DFF4F1 #DCF2F0 #D9F1EF #D6F0EE #D4EFED #D1EEEC #CFEDEC

#DFF4F1 - #D6F0EE - #CFEDEC

CSS codes

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

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