#3FACC6 - #C0EEAC | 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 #3FACC6 to #C0EEAC

#3FACC6 #C0EEAC

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

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

0.0%	0.0% #3FACC6	RGB 63 172 198	#3FACC6
16.7%	16.7% #54B7C1	RGB 84 183 193	#54B7C1
33.3%	33.3% #6AC2BD	RGB 106 194 189	#6AC2BD
50.0%	50.0% #7FCDB9	RGB 127 205 185	#7FCDB9
66.7%	66.7% #95D8B4	RGB 149 216 180	#95D8B4
83.3%	83.3% #AAE3B0	RGB 170 227 176	#AAE3B0
100.0%	100.0% #C0EEAC	RGB 192 238 172	#C0EEAC

#3FACC6 #54B7C1 #6AC2BD #7FCDB9 #95D8B4 #AAE3B0 #C0EEAC

#3FACC6 - #C0EEAC

HSV Blend

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

0.0%	0.0% #3FACC6	RGB 63 172 198	#3FACC6
16.7%	16.7% #4ECCC5	RGB 78 204 197	#4ECCC5
33.3%	33.3% #5FD3AF	RGB 95 211 175	#5FD3AF
50.0%	50.0% #71DA9F	RGB 113 218 159	#71DA9F
66.7%	66.7% #84E096	RGB 132 224 150	#84E096
83.3%	83.3% #9BE797	RGB 155 231 151	#9BE797
100.0%	100.0% #C0EEAC	RGB 192 238 172	#C0EEAC

#3FACC6 #4ECCC5 #5FD3AF #71DA9F #84E096 #9BE797 #C0EEAC

#3FACC6 - #71DA9F - #C0EEAC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3FACC6 0%, #71DA9F 50%, #C0EEAC 100%);
    background: -webkit-linear-gradient(top, #3FACC6 0%, #71DA9F 50%, #C0EEAC 100%);
    background: linear-gradient(to bottom, #3FACC6 0%, #71DA9F 50%, #C0EEAC 100%);
}
</style>