#BABFF2 - #D1DFEA | 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 #BABFF2 to #D1DFEA

#BABFF2 #D1DFEA

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

#BABFF2 - #D1DFEA | 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 #BABFF2 as 0% and #D1DFEA as 100%.

0.0%	0.0% #BABFF2	RGB 186 191 242	#BABFF2
16.7%	16.7% #BDC4F0	RGB 189 196 240	#BDC4F0
33.3%	33.3% #C1C9EF	RGB 193 201 239	#C1C9EF
50.0%	50.0% #C5CFEE	RGB 197 207 238	#C5CFEE
66.7%	66.7% #C9D4EC	RGB 201 212 236	#C9D4EC
83.3%	83.3% #CDD9EB	RGB 205 217 235	#CDD9EB
100.0%	100.0% #D1DFEA	RGB 209 223 234	#D1DFEA

#BABFF2 #BDC4F0 #C1C9EF #C5CFEE #C9D4EC #CDD9EB #D1DFEA

#BABFF2 - #D1DFEA

HSV Blend

#BABFF2 - #D1DFEA | 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 #BABFF2 as 0% and #D1DFEA as 100%.

0.0%	0.0% #BABFF2	RGB 186 191 242	#BABFF2
16.7%	16.7% #BDC6F0	RGB 189 198 240	#BDC6F0
33.3%	33.3% #C1CDEF	RGB 193 205 239	#C1CDEF
50.0%	50.0% #C5D2EE	RGB 197 210 238	#C5D2EE
66.7%	66.7% #C9D7EC	RGB 201 215 236	#C9D7EC
83.3%	83.3% #CDDBEB	RGB 205 219 235	#CDDBEB
100.0%	100.0% #D1DFEA	RGB 209 223 234	#D1DFEA

#BABFF2 #BDC6F0 #C1CDEF #C5D2EE #C9D7EC #CDDBEB #D1DFEA

#BABFF2 - #C5D2EE - #D1DFEA

CSS codes

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

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