#3E8AA2 - #BFCFC1 | 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 #3E8AA2 to #BFCFC1

#3E8AA2 #BFCFC1

Calculate the color between two colors, #3E8AA2 and #BFCFC1. 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)

#3E8AA2 - #BFCFC1 | 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 #3E8AA2 as 0% and #BFCFC1 as 100%.

0.0%	0.0% #3E8AA2	RGB 62 138 162	#3E8AA2
16.7%	16.7% #5395A7	RGB 83 149 167	#5395A7
33.3%	33.3% #69A1AC	RGB 105 161 172	#69A1AC
50.0%	50.0% #7EACB1	RGB 126 172 177	#7EACB1
66.7%	66.7% #94B8B6	RGB 148 184 182	#94B8B6
83.3%	83.3% #A9C3BB	RGB 169 195 187	#A9C3BB
100.0%	100.0% #BFCFC1	RGB 191 207 193	#BFCFC1

#3E8AA2 #5395A7 #69A1AC #7EACB1 #94B8B6 #A9C3BB #BFCFC1

#3E8AA2 - #BFCFC1

HSV Blend

#3E8AA2 - #BFCFC1 | 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 #3E8AA2 as 0% and #BFCFC1 as 100%.

0.0%	0.0% #3E89A2	RGB 62 137 162	#3E89A2
16.7%	16.7% #50A4A9	RGB 80 164 169	#50A4A9
33.3%	33.3% #63B1A6	RGB 99 177 166	#63B1A6
50.0%	50.0% #78B8A4	RGB 120 184 164	#78B8A4
66.7%	66.7% #8EC0A7	RGB 142 192 167	#8EC0A7
83.3%	83.3% #A6C7B0	RGB 166 199 176	#A6C7B0
100.0%	100.0% #BFCFC1	RGB 191 207 193	#BFCFC1

#3E89A2 #50A4A9 #63B1A6 #78B8A4 #8EC0A7 #A6C7B0 #BFCFC1

#3E8AA2 - #78B8A4 - #BFCFC1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3E89A2 0%, #78B8A4 50%, #BFCFC1 100%);
    background: -webkit-linear-gradient(top, #3E89A2 0%, #78B8A4 50%, #BFCFC1 100%);
    background: linear-gradient(to bottom, #3E89A2 0%, #78B8A4 50%, #BFCFC1 100%);
}
</style>