#5BECE5 - #00CAC8 | 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 #5BECE5 to #00CAC8

#5BECE5 #00CAC8

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

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

0.0%	0.0% #5BECE5	RGB 91 236 229	#5BECE5
16.7%	16.7% #4BE6E0	RGB 75 230 224	#4BE6E0
33.3%	33.3% #3CE0DB	RGB 60 224 219	#3CE0DB
50.0%	50.0% #2DDBD6	RGB 45 219 214	#2DDBD6
66.7%	66.7% #1ED5D1	RGB 30 213 209	#1ED5D1
83.3%	83.3% #0FCFCC	RGB 15 207 204	#0FCFCC
100.0%	100.0% #00CAC8	RGB 0 202 200	#00CAC8

#5BECE5 #4BE6E0 #3CE0DB #2DDBD6 #1ED5D1 #0FCFCC #00CAC8

#5BECE5 - #00CAC8

HSV Blend

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

0.0%	0.0% #5AECE5	RGB 90 236 229	#5AECE5
16.7%	16.7% #4AE6DF	RGB 74 230 223	#4AE6DF
33.3%	33.3% #39E0DA	RGB 57 224 218	#39E0DA
50.0%	50.0% #2ADBD5	RGB 42 219 213	#2ADBD5
66.7%	66.7% #1BD5D1	RGB 27 213 209	#1BD5D1
83.3%	83.3% #0DCFCC	RGB 13 207 204	#0DCFCC
100.0%	100.0% #00CAC8	RGB 0 202 200	#00CAC8

#5AECE5 #4AE6DF #39E0DA #2ADBD5 #1BD5D1 #0DCFCC #00CAC8

#5BECE5 - #2ADBD5 - #00CAC8

CSS codes

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

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