#D9ECF0 - #8AA7BD | 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 #D9ECF0 to #8AA7BD

#D9ECF0 #8AA7BD

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

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

0.0%	0.0% #D9ECF0	RGB 217 236 240	#D9ECF0
16.7%	16.7% #CBE0E7	RGB 203 224 231	#CBE0E7
33.3%	33.3% #BED5DF	RGB 190 213 223	#BED5DF
50.0%	50.0% #B1C9D6	RGB 177 201 214	#B1C9D6
66.7%	66.7% #A4BECE	RGB 164 190 206	#A4BECE
83.3%	83.3% #97B2C5	RGB 151 178 197	#97B2C5
100.0%	100.0% #8AA7BD	RGB 138 167 189	#8AA7BD

#D9ECF0 #CBE0E7 #BED5DF #B1C9D6 #A4BECE #97B2C5 #8AA7BD

#D9ECF0 - #8AA7BD

HSV Blend

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

0.0%	0.0% #D9ECF0	RGB 217 236 240	#D9ECF0
16.7%	16.7% #CAE1E7	RGB 202 225 231	#CAE1E7
33.3%	33.3% #BCD6DF	RGB 188 214 223	#BCD6DF
50.0%	50.0% #AFCAD6	RGB 175 202 214	#AFCAD6
66.7%	66.7% #A2BECE	RGB 162 190 206	#A2BECE
83.3%	83.3% #95B3C5	RGB 149 179 197	#95B3C5
100.0%	100.0% #8AA7BD	RGB 138 167 189	#8AA7BD

#D9ECF0 #CAE1E7 #BCD6DF #AFCAD6 #A2BECE #95B3C5 #8AA7BD

#D9ECF0 - #AFCAD6 - #8AA7BD

CSS codes

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

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