#0089D4 - #B6DDF2 | 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 #0089D4 to #B6DDF2

#0089D4 #B6DDF2

Calculate the color between two colors, #0089D4 and #B6DDF2. 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)

#0089D4 - #B6DDF2 | 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 #0089D4 as 0% and #B6DDF2 as 100%.

0.0%	0.0% #0089D4	RGB 0 137 212	#0089D4
16.7%	16.7% #1E97D9	RGB 30 151 217	#1E97D9
33.3%	33.3% #3CA5DE	RGB 60 165 222	#3CA5DE
50.0%	50.0% #5BB3E3	RGB 91 179 227	#5BB3E3
66.7%	66.7% #79C1E8	RGB 121 193 232	#79C1E8
83.3%	83.3% #97CFED	RGB 151 207 237	#97CFED
100.0%	100.0% #B6DDF2	RGB 182 221 242	#B6DDF2

#0089D4 #1E97D9 #3CA5DE #5BB3E3 #79C1E8 #97CFED #B6DDF2

#0089D4 - #B6DDF2

HSV Blend

#0089D4 - #B6DDF2 | 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 #0089D4 as 0% and #B6DDF2 as 100%.

0.0%	0.0% #0088D4	RGB 0 136 212	#0088D4
16.7%	16.7% #1B95D9	RGB 27 149 217	#1B95D9
33.3%	33.3% #37A3DE	RGB 55 163 222	#37A3DE
50.0%	50.0% #55B1E3	RGB 85 177 227	#55B1E3
66.7%	66.7% #74BFE8	RGB 116 191 232	#74BFE8
83.3%	83.3% #94CDED	RGB 148 205 237	#94CDED
100.0%	100.0% #B6DDF2	RGB 182 221 242	#B6DDF2

#0088D4 #1B95D9 #37A3DE #55B1E3 #74BFE8 #94CDED #B6DDF2

#0089D4 - #55B1E3 - #B6DDF2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0088D4 0%, #55B1E3 50%, #B6DDF2 100%);
    background: -webkit-linear-gradient(top, #0088D4 0%, #55B1E3 50%, #B6DDF2 100%);
    background: linear-gradient(to bottom, #0088D4 0%, #55B1E3 50%, #B6DDF2 100%);
}
</style>