#BAFFBA - #FFEEC1 | 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 #BAFFBA to #FFEEC1

#BAFFBA #FFEEC1

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

#BAFFBA - #FFEEC1 | 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 #BAFFBA as 0% and #FFEEC1 as 100%.

0.0%	0.0% #BAFFBA	RGB 186 255 186	#BAFFBA
16.7%	16.7% #C5FCBB	RGB 197 252 187	#C5FCBB
33.3%	33.3% #D1F9BC	RGB 209 249 188	#D1F9BC
50.0%	50.0% #DCF6BD	RGB 220 246 189	#DCF6BD
66.7%	66.7% #E8F3BE	RGB 232 243 190	#E8F3BE
83.3%	83.3% #F3F0BF	RGB 243 240 191	#F3F0BF
100.0%	100.0% #FFEEC1	RGB 255 238 193	#FFEEC1

#BAFFBA #C5FCBB #D1F9BC #DCF6BD #E8F3BE #F3F0BF #FFEEC1

#BAFFBA - #FFEEC1

HSV Blend

#BAFFBA - #FFEEC1 | 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 #BAFFBA as 0% and #FFEEC1 as 100%.

0.0%	0.0% #BAFFBA	RGB 186 255 186	#BAFFBA
16.7%	16.7% #C9FFBB	RGB 201 255 187	#C9FFBB
33.3%	33.3% #D8FFBC	RGB 216 255 188	#D8FFBC
50.0%	50.0% #E7FFBD	RGB 231 255 189	#E7FFBD
66.7%	66.7% #F5FFBE	RGB 245 255 190	#F5FFBE
83.3%	83.3% #FFFBBF	RGB 255 251 191	#FFFBBF
100.0%	100.0% #FFEEC1	RGB 255 238 193	#FFEEC1

#BAFFBA #C9FFBB #D8FFBC #E7FFBD #F5FFBE #FFFBBF #FFEEC1

#BAFFBA - #E7FFBD - #FFEEC1

CSS codes

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

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