#00BAEB - #0070B4 | 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 #00BAEB to #0070B4

#00BAEB #0070B4

Calculate the color between two colors, #00BAEB and #0070B4. 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)

#00BAEB - #0070B4 | 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 #00BAEB as 0% and #0070B4 as 100%.

0.0%	0.0% #00BAEB	RGB 0 186 235	#00BAEB
16.7%	16.7% #00ADE1	RGB 0 173 225	#00ADE1
33.3%	33.3% #00A1D8	RGB 0 161 216	#00A1D8
50.0%	50.0% #0095CF	RGB 0 149 207	#0095CF
66.7%	66.7% #0088C6	RGB 0 136 198	#0088C6
83.3%	83.3% #007CBD	RGB 0 124 189	#007CBD
100.0%	100.0% #0070B4	RGB 0 112 180	#0070B4

#00BAEB #00ADE1 #00A1D8 #0095CF #0088C6 #007CBD #0070B4

#00BAEB - #0070B4

HSV Blend

#00BAEB - #0070B4 | 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 #00BAEB as 0% and #0070B4 as 100%.

0.0%	0.0% #00BAEB	RGB 0 186 235	#00BAEB
16.7%	16.7% #00ACE1	RGB 0 172 225	#00ACE1
33.3%	33.3% #009FD8	RGB 0 159 216	#009FD8
50.0%	50.0% #0092CF	RGB 0 146 207	#0092CF
66.7%	66.7% #0086C6	RGB 0 134 198	#0086C6
83.3%	83.3% #007BBD	RGB 0 123 189	#007BBD
100.0%	100.0% #0070B4	RGB 0 112 180	#0070B4

#00BAEB #00ACE1 #009FD8 #0092CF #0086C6 #007BBD #0070B4

#00BAEB - #0092CF - #0070B4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #00BAEB 0%, #0092CF 50%, #0070B4 100%);
    background: -webkit-linear-gradient(top, #00BAEB 0%, #0092CF 50%, #0070B4 100%);
    background: linear-gradient(to bottom, #00BAEB 0%, #0092CF 50%, #0070B4 100%);
}
</style>