#BFDFDB - #54B0AD | 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 #BFDFDB to #54B0AD

#BFDFDB #54B0AD

Calculate the color between two colors, #BFDFDB and #54B0AD. 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)

#BFDFDB - #54B0AD | 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 #BFDFDB as 0% and #54B0AD as 100%.

0.0%	0.0% #BFDFDB	RGB 191 223 219	#BFDFDB
16.7%	16.7% #ADD7D3	RGB 173 215 211	#ADD7D3
33.3%	33.3% #9BCFCB	RGB 155 207 203	#9BCFCB
50.0%	50.0% #89C7C4	RGB 137 199 196	#89C7C4
66.7%	66.7% #77BFBC	RGB 119 191 188	#77BFBC
83.3%	83.3% #65B7B4	RGB 101 183 180	#65B7B4
100.0%	100.0% #54B0AD	RGB 84 176 173	#54B0AD

#BFDFDB #ADD7D3 #9BCFCB #89C7C4 #77BFBC #65B7B4 #54B0AD

#BFDFDB - #54B0AD

HSV Blend

#BFDFDB - #54B0AD | 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 #BFDFDB as 0% and #54B0AD as 100%.

0.0%	0.0% #BFDFDB	RGB 191 223 219	#BFDFDB
16.7%	16.7% #AAD7D2	RGB 170 215 210	#AAD7D2
33.3%	33.3% #97CFCA	RGB 151 207 202	#97CFCA
50.0%	50.0% #85C7C2	RGB 133 199 194	#85C7C2
66.7%	66.7% #73BFBA	RGB 115 191 186	#73BFBA
83.3%	83.3% #63B7B3	RGB 99 183 179	#63B7B3
100.0%	100.0% #54B0AD	RGB 84 176 173	#54B0AD

#BFDFDB #AAD7D2 #97CFCA #85C7C2 #73BFBA #63B7B3 #54B0AD

#BFDFDB - #85C7C2 - #54B0AD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BFDFDB 0%, #85C7C2 50%, #54B0AD 100%);
    background: -webkit-linear-gradient(top, #BFDFDB 0%, #85C7C2 50%, #54B0AD 100%);
    background: linear-gradient(to bottom, #BFDFDB 0%, #85C7C2 50%, #54B0AD 100%);
}
</style>