#BDD3A8 - #CAFECF | 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 #BDD3A8 to #CAFECF

#BDD3A8 #CAFECF

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

#BDD3A8 - #CAFECF | 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 #BDD3A8 as 0% and #CAFECF as 100%.

0.0%	0.0% #BDD3A8	RGB 189 211 168	#BDD3A8
16.7%	16.7% #BFDAAE	RGB 191 218 174	#BFDAAE
33.3%	33.3% #C1E1B5	RGB 193 225 181	#C1E1B5
50.0%	50.0% #C3E8BB	RGB 195 232 187	#C3E8BB
66.7%	66.7% #C5EFC2	RGB 197 239 194	#C5EFC2
83.3%	83.3% #C7F6C8	RGB 199 246 200	#C7F6C8
100.0%	100.0% #CAFECF	RGB 202 254 207	#CAFECF

#BDD3A8 #BFDAAE #C1E1B5 #C3E8BB #C5EFC2 #C7F6C8 #CAFECF

#BDD3A8 - #CAFECF

HSV Blend

#BDD3A8 - #CAFECF | 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 #BDD3A8 as 0% and #CAFECF as 100%.

0.0%	0.0% #BDD3A8	RGB 189 211 168	#BDD3A8
16.7%	16.7% #BFDAAD	RGB 191 218 173	#BFDAAD
33.3%	33.3% #C0E1B3	RGB 192 225 179	#C0E1B3
50.0%	50.0% #C2E8B9	RGB 194 232 185	#C2E8B9
66.7%	66.7% #C3EFBE	RGB 195 239 190	#C3EFBE
83.3%	83.3% #C4F6C4	RGB 196 246 196	#C4F6C4
100.0%	100.0% #CAFECF	RGB 202 254 207	#CAFECF

#BDD3A8 #BFDAAD #C0E1B3 #C2E8B9 #C3EFBE #C4F6C4 #CAFECF

#BDD3A8 - #C2E8B9 - #CAFECF

CSS codes

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

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