#8DD2FF - #DEF1FF | 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 #8DD2FF to #DEF1FF

#8DD2FF #DEF1FF

Calculate the color between two colors, #8DD2FF and #DEF1FF. 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)

#8DD2FF - #DEF1FF | 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 #8DD2FF as 0% and #DEF1FF as 100%.

0.0%	0.0% #8DD2FF	RGB 141 210 255	#8DD2FF
16.7%	16.7% #9AD7FF	RGB 154 215 255	#9AD7FF
33.3%	33.3% #A8DCFF	RGB 168 220 255	#A8DCFF
50.0%	50.0% #B5E1FF	RGB 181 225 255	#B5E1FF
66.7%	66.7% #C3E6FF	RGB 195 230 255	#C3E6FF
83.3%	83.3% #D0EBFF	RGB 208 235 255	#D0EBFF
100.0%	100.0% #DEF1FF	RGB 222 241 255	#DEF1FF

#8DD2FF #9AD7FF #A8DCFF #B5E1FF #C3E6FF #D0EBFF #DEF1FF

#8DD2FF - #DEF1FF

HSV Blend

#8DD2FF - #DEF1FF | 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 #8DD2FF as 0% and #DEF1FF as 100%.

0.0%	0.0% #8DD2FF	RGB 141 210 255	#8DD2FF
16.7%	16.7% #9AD6FF	RGB 154 214 255	#9AD6FF
33.3%	33.3% #A8DBFF	RGB 168 219 255	#A8DBFF
50.0%	50.0% #B5E0FF	RGB 181 224 255	#B5E0FF
66.7%	66.7% #C3E6FF	RGB 195 230 255	#C3E6FF
83.3%	83.3% #D0EBFF	RGB 208 235 255	#D0EBFF
100.0%	100.0% #DEF1FF	RGB 222 241 255	#DEF1FF

#8DD2FF #9AD6FF #A8DBFF #B5E0FF #C3E6FF #D0EBFF #DEF1FF

#8DD2FF - #B5E0FF - #DEF1FF

CSS codes

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

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