#BABCBC - #CCFFEC | 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 #BABCBC to #CCFFEC

#BABCBC #CCFFEC

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

#BABCBC - #CCFFEC | 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 #BABCBC as 0% and #CCFFEC as 100%.

0.0%	0.0% #BABCBC	RGB 186 188 188	#BABCBC
16.7%	16.7% #BDC7C4	RGB 189 199 196	#BDC7C4
33.3%	33.3% #C0D2CC	RGB 192 210 204	#C0D2CC
50.0%	50.0% #C3DDD4	RGB 195 221 212	#C3DDD4
66.7%	66.7% #C6E8DC	RGB 198 232 220	#C6E8DC
83.3%	83.3% #C9F3E4	RGB 201 243 228	#C9F3E4
100.0%	100.0% #CCFFEC	RGB 204 255 236	#CCFFEC

#BABCBC #BDC7C4 #C0D2CC #C3DDD4 #C6E8DC #C9F3E4 #CCFFEC

#BABCBC - #CCFFEC

HSV Blend

#BABCBC - #CCFFEC | 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 #BABCBC as 0% and #CCFFEC as 100%.

0.0%	0.0% #BABCBC	RGB 186 188 188	#BABCBC
16.7%	16.7% #BEC7C6	RGB 190 199 198	#BEC7C6
33.3%	33.3% #C2D2D0	RGB 194 210 208	#C2D2D0
50.0%	50.0% #C6DDD9	RGB 198 221 217	#C6DDD9
66.7%	66.7% #C8E8E0	RGB 200 232 224	#C8E8E0
83.3%	83.3% #CAF3E7	RGB 202 243 231	#CAF3E7
100.0%	100.0% #CCFFEC	RGB 204 255 236	#CCFFEC

#BABCBC #BEC7C6 #C2D2D0 #C6DDD9 #C8E8E0 #CAF3E7 #CCFFEC

#BABCBC - #C6DDD9 - #CCFFEC

CSS codes

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

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