#00B9DC - #5DB0FF | 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 #00B9DC to #5DB0FF

#00B9DC #5DB0FF

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

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

0.0%	0.0% #00B9DC	RGB 0 185 220	#00B9DC
16.7%	16.7% #0FB7E1	RGB 15 183 225	#0FB7E1
33.3%	33.3% #1FB6E7	RGB 31 182 231	#1FB6E7
50.0%	50.0% #2EB4ED	RGB 46 180 237	#2EB4ED
66.7%	66.7% #3EB3F3	RGB 62 179 243	#3EB3F3
83.3%	83.3% #4DB1F9	RGB 77 177 249	#4DB1F9
100.0%	100.0% #5DB0FF	RGB 93 176 255	#5DB0FF

#00B9DC #0FB7E1 #1FB6E7 #2EB4ED #3EB3F3 #4DB1F9 #5DB0FF

#00B9DC - #5DB0FF

HSV Blend

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

0.0%	0.0% #00B8DC	RGB 0 184 220	#00B8DC
16.7%	16.7% #0DB4E1	RGB 13 180 225	#0DB4E1
33.3%	33.3% #1CB1E7	RGB 28 177 231	#1CB1E7
50.0%	50.0% #2BAEED	RGB 43 174 237	#2BAEED
66.7%	66.7% #3BADF3	RGB 59 173 243	#3BADF3
83.3%	83.3% #4BAEF9	RGB 75 174 249	#4BAEF9
100.0%	100.0% #5DB0FF	RGB 93 176 255	#5DB0FF

#00B8DC #0DB4E1 #1CB1E7 #2BAEED #3BADF3 #4BAEF9 #5DB0FF

#00B9DC - #2BAEED - #5DB0FF

CSS codes

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

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