#DEF3EF - #FEFDFF | 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 #DEF3EF to #FEFDFF

#DEF3EF #FEFDFF

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

#DEF3EF - #FEFDFF | 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 #DEF3EF as 0% and #FEFDFF as 100%.

0.0%	0.0% #DEF3EF	RGB 222 243 239	#DEF3EF
16.7%	16.7% #E3F4F1	RGB 227 244 241	#E3F4F1
33.3%	33.3% #E8F6F4	RGB 232 246 244	#E8F6F4
50.0%	50.0% #EEF8F7	RGB 238 248 247	#EEF8F7
66.7%	66.7% #F3F9F9	RGB 243 249 249	#F3F9F9
83.3%	83.3% #F8FBFC	RGB 248 251 252	#F8FBFC
100.0%	100.0% #FEFDFF	RGB 254 253 255	#FEFDFF

#DEF3EF #E3F4F1 #E8F6F4 #EEF8F7 #F3F9F9 #F8FBFC #FEFDFF

#DEF3EF - #FEFDFF

HSV Blend

#DEF3EF - #FEFDFF | 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 #DEF3EF as 0% and #FEFDFF as 100%.

0.0%	0.0% #DEF3EF	RGB 222 243 239	#DEF3EF
16.7%	16.7% #E3F3F5	RGB 227 243 245	#E3F3F5
33.3%	33.3% #E8F1F7	RGB 232 241 247	#E8F1F7
50.0%	50.0% #EDF1F9	RGB 237 241 249	#EDF1F9
66.7%	66.7% #F2F2FB	RGB 242 242 251	#F2F2FB
83.3%	83.3% #F8F7FD	RGB 248 247 253	#F8F7FD
100.0%	100.0% #FEFDFF	RGB 254 253 255	#FEFDFF

#DEF3EF #E3F3F5 #E8F1F7 #EDF1F9 #F2F2FB #F8F7FD #FEFDFF

#DEF3EF - #EDF1F9 - #FEFDFF

CSS codes

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

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