#BEC1D2 - #ECECF2 | 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 #BEC1D2 to #ECECF2

#BEC1D2 #ECECF2

Calculate the color between two colors, #BEC1D2 and #ECECF2. 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)

#BEC1D2 - #ECECF2 | 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 #BEC1D2 as 0% and #ECECF2 as 100%.

0.0%	0.0% #BEC1D2	RGB 190 193 210	#BEC1D2
16.7%	16.7% #C5C8D7	RGB 197 200 215	#C5C8D7
33.3%	33.3% #CDCFDC	RGB 205 207 220	#CDCFDC
50.0%	50.0% #D5D6E2	RGB 213 214 226	#D5D6E2
66.7%	66.7% #DCDDE7	RGB 220 221 231	#DCDDE7
83.3%	83.3% #E4E4EC	RGB 228 228 236	#E4E4EC
100.0%	100.0% #ECECF2	RGB 236 236 242	#ECECF2

#BEC1D2 #C5C8D7 #CDCFDC #D5D6E2 #DCDDE7 #E4E4EC #ECECF2

#BEC1D2 - #ECECF2

HSV Blend

#BEC1D2 - #ECECF2 | 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 #BEC1D2 as 0% and #ECECF2 as 100%.

0.0%	0.0% #BEC1D2	RGB 190 193 210	#BEC1D2
16.7%	16.7% #C5C7D7	RGB 197 199 215	#C5C7D7
33.3%	33.3% #CCCEDC	RGB 204 206 220	#CCCEDC
50.0%	50.0% #D4D5E2	RGB 212 213 226	#D4D5E2
66.7%	66.7% #DCDCE7	RGB 220 220 231	#DCDCE7
83.3%	83.3% #E4E4EC	RGB 228 228 236	#E4E4EC
100.0%	100.0% #ECECF2	RGB 236 236 242	#ECECF2

#BEC1D2 #C5C7D7 #CCCEDC #D4D5E2 #DCDCE7 #E4E4EC #ECECF2

#BEC1D2 - #D4D5E2 - #ECECF2

CSS codes

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

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