#4FD7FF - #DCFFFD | 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 #4FD7FF to #DCFFFD

#4FD7FF #DCFFFD

Calculate the color between two colors, #4FD7FF and #DCFFFD. 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)

#4FD7FF - #DCFFFD | 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 #4FD7FF as 0% and #DCFFFD as 100%.

0.0%	0.0% #4FD7FF	RGB 79 215 255	#4FD7FF
16.7%	16.7% #66DDFE	RGB 102 221 254	#66DDFE
33.3%	33.3% #7EE4FE	RGB 126 228 254	#7EE4FE
50.0%	50.0% #95EBFE	RGB 149 235 254	#95EBFE
66.7%	66.7% #ADF1FD	RGB 173 241 253	#ADF1FD
83.3%	83.3% #C4F8FD	RGB 196 248 253	#C4F8FD
100.0%	100.0% #DCFFFD	RGB 220 255 253	#DCFFFD

#4FD7FF #66DDFE #7EE4FE #95EBFE #ADF1FD #C4F8FD #DCFFFD

#4FD7FF - #DCFFFD

HSV Blend

#4FD7FF - #DCFFFD | 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 #4FD7FF as 0% and #DCFFFD as 100%.

0.0%	0.0% #4FD7FF	RGB 79 215 255	#4FD7FF
16.7%	16.7% #66E3FF	RGB 102 227 255	#66E3FF
33.3%	33.3% #7EEDFF	RGB 126 237 255	#7EEDFF
50.0%	50.0% #95F6FF	RGB 149 246 255	#95F6FF
66.7%	66.7% #ADFBFF	RGB 173 251 255	#ADFBFF
83.3%	83.3% #C4FFFE	RGB 196 255 254	#C4FFFE
100.0%	100.0% #DCFFFD	RGB 220 255 253	#DCFFFD

#4FD7FF #66E3FF #7EEDFF #95F6FF #ADFBFF #C4FFFE #DCFFFD

#4FD7FF - #95F6FF - #DCFFFD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4FD7FF 0%, #95F6FF 50%, #DCFFFD 100%);
    background: -webkit-linear-gradient(top, #4FD7FF 0%, #95F6FF 50%, #DCFFFD 100%);
    background: linear-gradient(to bottom, #4FD7FF 0%, #95F6FF 50%, #DCFFFD 100%);
}
</style>