#3FB4A8 - #C8E7A8 | 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 #3FB4A8 to #C8E7A8

#3FB4A8 #C8E7A8

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

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

0.0%	0.0% #3FB4A8	RGB 63 180 168	#3FB4A8
16.7%	16.7% #55BCA8	RGB 85 188 168	#55BCA8
33.3%	33.3% #6CC5A8	RGB 108 197 168	#6CC5A8
50.0%	50.0% #83CDA8	RGB 131 205 168	#83CDA8
66.7%	66.7% #9AD6A8	RGB 154 214 168	#9AD6A8
83.3%	83.3% #B1DEA8	RGB 177 222 168	#B1DEA8
100.0%	100.0% #C8E7A8	RGB 200 231 168	#C8E7A8

#3FB4A8 #55BCA8 #6CC5A8 #83CDA8 #9AD6A8 #B1DEA8 #C8E7A8

#3FB4A8 - #C8E7A8

HSV Blend

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

0.0%	0.0% #3FB4A8	RGB 63 180 168	#3FB4A8
16.7%	16.7% #4DBC97	RGB 77 188 151	#4DBC97
33.3%	33.3% #5DC58A	RGB 93 197 138	#5DC58A
50.0%	50.0% #6ECD81	RGB 110 205 129	#6ECD81
66.7%	66.7% #84D680	RGB 132 214 128	#84D680
83.3%	83.3% #A8DE93	RGB 168 222 147	#A8DE93
100.0%	100.0% #C8E7A8	RGB 200 231 168	#C8E7A8

#3FB4A8 #4DBC97 #5DC58A #6ECD81 #84D680 #A8DE93 #C8E7A8

#3FB4A8 - #6ECD81 - #C8E7A8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3FB4A8 0%, #6ECD81 50%, #C8E7A8 100%);
    background: -webkit-linear-gradient(top, #3FB4A8 0%, #6ECD81 50%, #C8E7A8 100%);
    background: linear-gradient(to bottom, #3FB4A8 0%, #6ECD81 50%, #C8E7A8 100%);
}
</style>