#5FE3E3 - #00BDC2 | 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 #5FE3E3 to #00BDC2

#5FE3E3 #00BDC2

Calculate the color between two colors, #5FE3E3 and #00BDC2. 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)

#5FE3E3 - #00BDC2 | 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 #5FE3E3 as 0% and #00BDC2 as 100%.

0.0%	0.0% #5FE3E3	RGB 95 227 227	#5FE3E3
16.7%	16.7% #4FDCDD	RGB 79 220 221	#4FDCDD
33.3%	33.3% #3FD6D8	RGB 63 214 216	#3FD6D8
50.0%	50.0% #2FD0D2	RGB 47 208 210	#2FD0D2
66.7%	66.7% #1FC9CD	RGB 31 201 205	#1FC9CD
83.3%	83.3% #0FC3C7	RGB 15 195 199	#0FC3C7
100.0%	100.0% #00BDC2	RGB 0 189 194	#00BDC2

#5FE3E3 #4FDCDD #3FD6D8 #2FD0D2 #1FC9CD #0FC3C7 #00BDC2

#5FE3E3 - #00BDC2

HSV Blend

#5FE3E3 - #00BDC2 | 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 #5FE3E3 as 0% and #00BDC2 as 100%.

0.0%	0.0% #5EE3E3	RGB 94 227 227	#5EE3E3
16.7%	16.7% #4DDCDD	RGB 77 220 221	#4DDCDD
33.3%	33.3% #3CD6D8	RGB 60 214 216	#3CD6D8
50.0%	50.0% #2CD0D2	RGB 44 208 210	#2CD0D2
66.7%	66.7% #1CC9CD	RGB 28 201 205	#1CC9CD
83.3%	83.3% #0DC3C7	RGB 13 195 199	#0DC3C7
100.0%	100.0% #00BDC2	RGB 0 189 194	#00BDC2

#5EE3E3 #4DDCDD #3CD6D8 #2CD0D2 #1CC9CD #0DC3C7 #00BDC2

#5FE3E3 - #2CD0D2 - #00BDC2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5EE3E3 0%, #2CD0D2 50%, #00BDC2 100%);
    background: -webkit-linear-gradient(top, #5EE3E3 0%, #2CD0D2 50%, #00BDC2 100%);
    background: linear-gradient(to bottom, #5EE3E3 0%, #2CD0D2 50%, #00BDC2 100%);
}
</style>