#BBCCBA - #DCF8FF | 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 #BBCCBA to #DCF8FF

#BBCCBA #DCF8FF

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

#BBCCBA - #DCF8FF | 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 #BBCCBA as 0% and #DCF8FF as 100%.

0.0%	0.0% #BBCCBA	RGB 187 204 186	#BBCCBA
16.7%	16.7% #C0D3C5	RGB 192 211 197	#C0D3C5
33.3%	33.3% #C6DAD1	RGB 198 218 209	#C6DAD1
50.0%	50.0% #CBE2DC	RGB 203 226 220	#CBE2DC
66.7%	66.7% #D1E9E8	RGB 209 233 232	#D1E9E8
83.3%	83.3% #D6F0F3	RGB 214 240 243	#D6F0F3
100.0%	100.0% #DCF8FF	RGB 220 248 255	#DCF8FF

#BBCCBA #C0D3C5 #C6DAD1 #CBE2DC #D1E9E8 #D6F0F3 #DCF8FF

#BBCCBA - #DCF8FF

HSV Blend

#BBCCBA - #DCF8FF | 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 #BBCCBA as 0% and #DCF8FF as 100%.

0.0%	0.0% #BBCCBA	RGB 187 204 186	#BBCCBA
16.7%	16.7% #C0D4C3	RGB 192 212 195	#C0D4C3
33.3%	33.3% #C5DDCE	RGB 197 221 206	#C5DDCE
50.0%	50.0% #CBE5DA	RGB 203 229 218	#CBE5DA
66.7%	66.7% #D1EEE7	RGB 209 238 231	#D1EEE7
83.3%	83.3% #D6F6F6	RGB 214 246 246	#D6F6F6
100.0%	100.0% #DCF8FF	RGB 220 248 255	#DCF8FF

#BBCCBA #C0D4C3 #C5DDCE #CBE5DA #D1EEE7 #D6F6F6 #DCF8FF

#BBCCBA - #CBE5DA - #DCF8FF

CSS codes

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

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