#DFE6FD - #84A2D0 | 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 #DFE6FD to #84A2D0

#DFE6FD #84A2D0

Calculate the color between two colors, #DFE6FD and #84A2D0. 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)

#DFE6FD - #84A2D0 | 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 #DFE6FD as 0% and #84A2D0 as 100%.

0.0%	0.0% #DFE6FD	RGB 223 230 253	#DFE6FD
16.7%	16.7% #CFDAF5	RGB 207 218 245	#CFDAF5
33.3%	33.3% #C0CFEE	RGB 192 207 238	#C0CFEE
50.0%	50.0% #B1C4E6	RGB 177 196 230	#B1C4E6
66.7%	66.7% #A2B8DF	RGB 162 184 223	#A2B8DF
83.3%	83.3% #93ADD7	RGB 147 173 215	#93ADD7
100.0%	100.0% #84A2D0	RGB 132 162 208	#84A2D0

#DFE6FD #CFDAF5 #C0CFEE #B1C4E6 #A2B8DF #93ADD7 #84A2D0

#DFE6FD - #84A2D0

HSV Blend

#DFE6FD - #84A2D0 | 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 #DFE6FD as 0% and #84A2D0 as 100%.

0.0%	0.0% #DFE6FD	RGB 223 230 253	#DFE6FD
16.7%	16.7% #CED8F5	RGB 206 216 245	#CED8F5
33.3%	33.3% #BECBEE	RGB 190 203 238	#BECBEE
50.0%	50.0% #AEC0E6	RGB 174 192 230	#AEC0E6
66.7%	66.7% #9FB5DF	RGB 159 181 223	#9FB5DF
83.3%	83.3% #91ABD7	RGB 145 171 215	#91ABD7
100.0%	100.0% #84A2D0	RGB 132 162 208	#84A2D0

#DFE6FD #CED8F5 #BECBEE #AEC0E6 #9FB5DF #91ABD7 #84A2D0

#DFE6FD - #AEC0E6 - #84A2D0

CSS codes

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

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