#FFBAFD - #FFF7EE | 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 #FFBAFD to #FFF7EE

#FFBAFD #FFF7EE

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

#FFBAFD - #FFF7EE | 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 #FFBAFD as 0% and #FFF7EE as 100%.

0.0%	0.0% #FFBAFD	RGB 255 186 253	#FFBAFD
16.7%	16.7% #FFC4FA	RGB 255 196 250	#FFC4FA
33.3%	33.3% #FFCEF8	RGB 255 206 248	#FFCEF8
50.0%	50.0% #FFD8F5	RGB 255 216 245	#FFD8F5
66.7%	66.7% #FFE2F3	RGB 255 226 243	#FFE2F3
83.3%	83.3% #FFECF0	RGB 255 236 240	#FFECF0
100.0%	100.0% #FFF7EE	RGB 255 247 238	#FFF7EE

#FFBAFD #FFC4FA #FFCEF8 #FFD8F5 #FFE2F3 #FFECF0 #FFF7EE

#FFBAFD - #FFF7EE

HSV Blend

#FFBAFD - #FFF7EE | 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 #FFBAFD as 0% and #FFF7EE as 100%.

0.0%	0.0% #FFBAFD	RGB 255 186 253	#FFBAFD
16.7%	16.7% #FFC2EE	RGB 255 194 238	#FFC2EE
33.3%	33.3% #FFCBE3	RGB 255 203 227	#FFCBE3
50.0%	50.0% #FFD4DD	RGB 255 212 221	#FFD4DD
66.7%	66.7% #FFDDDC	RGB 255 221 220	#FFDDDC
83.3%	83.3% #FFECE5	RGB 255 236 229	#FFECE5
100.0%	100.0% #FFF7EE	RGB 255 247 238	#FFF7EE

#FFBAFD #FFC2EE #FFCBE3 #FFD4DD #FFDDDC #FFECE5 #FFF7EE

#FFBAFD - #FFD4DD - #FFF7EE

CSS codes

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

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