#B2BCD1 - #FFCCD2 | 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 #B2BCD1 to #FFCCD2

#B2BCD1 #FFCCD2

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

#B2BCD1 - #FFCCD2 | 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 #B2BCD1 as 0% and #FFCCD2 as 100%.

0.0%	0.0% #B2BCD1	RGB 178 188 209	#B2BCD1
16.7%	16.7% #BEBED1	RGB 190 190 209	#BEBED1
33.3%	33.3% #CBC1D1	RGB 203 193 209	#CBC1D1
50.0%	50.0% #D8C4D1	RGB 216 196 209	#D8C4D1
66.7%	66.7% #E5C6D1	RGB 229 198 209	#E5C6D1
83.3%	83.3% #F2C9D1	RGB 242 201 209	#F2C9D1
100.0%	100.0% #FFCCD2	RGB 255 204 210	#FFCCD2

#B2BCD1 #BEBED1 #CBC1D1 #D8C4D1 #E5C6D1 #F2C9D1 #FFCCD2

#B2BCD1 - #FFCCD2

HSV Blend

#B2BCD1 - #FFCCD2 | 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 #B2BCD1 as 0% and #FFCCD2 as 100%.

0.0%	0.0% #B2BCD1	RGB 178 188 209	#B2BCD1
16.7%	16.7% #B8B6D8	RGB 184 182 216	#B8B6D8
33.3%	33.3% #CABBE0	RGB 202 187 224	#CABBE0
50.0%	50.0% #DFBFE8	RGB 223 191 232	#DFBFE8
66.7%	66.7% #EFC3E9	RGB 239 195 233	#EFC3E9
83.3%	83.3% #F7C7DE	RGB 247 199 222	#F7C7DE
100.0%	100.0% #FFCCD2	RGB 255 204 210	#FFCCD2

#B2BCD1 #B8B6D8 #CABBE0 #DFBFE8 #EFC3E9 #F7C7DE #FFCCD2

#B2BCD1 - #DFBFE8 - #FFCCD2

CSS codes

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

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