#9FCAF2 - #ECE6E4 | 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 #9FCAF2 to #ECE6E4

#9FCAF2 #ECE6E4

Calculate the color between two colors, #9FCAF2 and #ECE6E4. 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)

#9FCAF2 - #ECE6E4 | 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 #9FCAF2 as 0% and #ECE6E4 as 100%.

0.0%	0.0% #9FCAF2	RGB 159 202 242	#9FCAF2
16.7%	16.7% #ABCEEF	RGB 171 206 239	#ABCEEF
33.3%	33.3% #B8D3ED	RGB 184 211 237	#B8D3ED
50.0%	50.0% #C5D8EB	RGB 197 216 235	#C5D8EB
66.7%	66.7% #D2DCE8	RGB 210 220 232	#D2DCE8
83.3%	83.3% #DFE1E6	RGB 223 225 230	#DFE1E6
100.0%	100.0% #ECE6E4	RGB 236 230 228	#ECE6E4

#9FCAF2 #ABCEEF #B8D3ED #C5D8EB #D2DCE8 #DFE1E6 #ECE6E4

#9FCAF2 - #ECE6E4

HSV Blend

#9FCAF2 - #ECE6E4 | 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 #9FCAF2 as 0% and #ECE6E4 as 100%.

0.0%	0.0% #9FCAF2	RGB 159 202 242	#9FCAF2
16.7%	16.7% #AAAEF1	RGB 170 174 241	#AAAEF1
33.3%	33.3% #CDB6F0	RGB 205 182 240	#CDB6F0
50.0%	50.0% #E8C1EF	RGB 232 193 239	#E8C1EF
66.7%	66.7% #EECDE3	RGB 238 205 227	#EECDE3
83.3%	83.3% #EDD8DD	RGB 237 216 221	#EDD8DD
100.0%	100.0% #ECE6E4	RGB 236 230 228	#ECE6E4

#9FCAF2 #AAAEF1 #CDB6F0 #E8C1EF #EECDE3 #EDD8DD #ECE6E4

#9FCAF2 - #E8C1EF - #ECE6E4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #9FCAF2 0%, #E8C1EF 50%, #ECE6E4 100%);
    background: -webkit-linear-gradient(top, #9FCAF2 0%, #E8C1EF 50%, #ECE6E4 100%);
    background: linear-gradient(to bottom, #9FCAF2 0%, #E8C1EF 50%, #ECE6E4 100%);
}
</style>