#8F9FDB - #DFE3F4 | 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 #8F9FDB to #DFE3F4

#8F9FDB #DFE3F4

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

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

0.0%	0.0% #8F9FDB	RGB 143 159 219	#8F9FDB
16.7%	16.7% #9CAADF	RGB 156 170 223	#9CAADF
33.3%	33.3% #A9B5E3	RGB 169 181 227	#A9B5E3
50.0%	50.0% #B7C1E7	RGB 183 193 231	#B7C1E7
66.7%	66.7% #C4CCEB	RGB 196 204 235	#C4CCEB
83.3%	83.3% #D1D7EF	RGB 209 215 239	#D1D7EF
100.0%	100.0% #DFE3F4	RGB 223 227 244	#DFE3F4

#8F9FDB #9CAADF #A9B5E3 #B7C1E7 #C4CCEB #D1D7EF #DFE3F4

#8F9FDB - #DFE3F4

HSV Blend

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

0.0%	0.0% #8F9EDB	RGB 143 158 219	#8F9EDB
16.7%	16.7% #9BA9DF	RGB 155 169 223	#9BA9DF
33.3%	33.3% #A8B4E3	RGB 168 180 227	#A8B4E3
50.0%	50.0% #B5BFE7	RGB 181 191 231	#B5BFE7
66.7%	66.7% #C2CAEB	RGB 194 202 235	#C2CAEB
83.3%	83.3% #D0D6EF	RGB 208 214 239	#D0D6EF
100.0%	100.0% #DFE3F4	RGB 223 227 244	#DFE3F4

#8F9EDB #9BA9DF #A8B4E3 #B5BFE7 #C2CAEB #D0D6EF #DFE3F4

#8F9FDB - #B5BFE7 - #DFE3F4

CSS codes

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

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