#BABFCF - #EBECF1 | 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 #BABFCF to #EBECF1

#BABFCF #EBECF1

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

#BABFCF - #EBECF1 | 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 #BABFCF as 0% and #EBECF1 as 100%.

0.0%	0.0% #BABFCF	RGB 186 191 207	#BABFCF
16.7%	16.7% #C2C6D4	RGB 194 198 212	#C2C6D4
33.3%	33.3% #CACEDA	RGB 202 206 218	#CACEDA
50.0%	50.0% #D2D5E0	RGB 210 213 224	#D2D5E0
66.7%	66.7% #DADDE5	RGB 218 221 229	#DADDE5
83.3%	83.3% #E2E4EB	RGB 226 228 235	#E2E4EB
100.0%	100.0% #EBECF1	RGB 235 236 241	#EBECF1

#BABFCF #C2C6D4 #CACEDA #D2D5E0 #DADDE5 #E2E4EB #EBECF1

#BABFCF - #EBECF1

HSV Blend

#BABFCF - #EBECF1 | 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 #BABFCF as 0% and #EBECF1 as 100%.

0.0%	0.0% #BABFCF	RGB 186 191 207	#BABFCF
16.7%	16.7% #C1C6D4	RGB 193 198 212	#C1C6D4
33.3%	33.3% #C9CDDA	RGB 201 205 218	#C9CDDA
50.0%	50.0% #D1D4E0	RGB 209 212 224	#D1D4E0
66.7%	66.7% #DADCE5	RGB 218 220 229	#DADCE5
83.3%	83.3% #E2E4EB	RGB 226 228 235	#E2E4EB
100.0%	100.0% #EBECF1	RGB 235 236 241	#EBECF1

#BABFCF #C1C6D4 #C9CDDA #D1D4E0 #DADCE5 #E2E4EB #EBECF1

#BABFCF - #D1D4E0 - #EBECF1

CSS codes

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

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