#00DFFB - #009AE1 | 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 #00DFFB to #009AE1

#00DFFB #009AE1

Calculate the color between two colors, #00DFFB and #009AE1. 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)

#00DFFB - #009AE1 | 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 #00DFFB as 0% and #009AE1 as 100%.

0.0%	0.0% #00DFFB	RGB 0 223 251	#00DFFB
16.7%	16.7% #00D3F6	RGB 0 211 246	#00D3F6
33.3%	33.3% #00C8F2	RGB 0 200 242	#00C8F2
50.0%	50.0% #00BCEE	RGB 0 188 238	#00BCEE
66.7%	66.7% #00B1E9	RGB 0 177 233	#00B1E9
83.3%	83.3% #00A5E5	RGB 0 165 229	#00A5E5
100.0%	100.0% #009AE1	RGB 0 154 225	#009AE1

#00DFFB #00D3F6 #00C8F2 #00BCEE #00B1E9 #00A5E5 #009AE1

#00DFFB - #009AE1

HSV Blend

#00DFFB - #009AE1 | 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 #00DFFB as 0% and #009AE1 as 100%.

0.0%	0.0% #00DFFB	RGB 0 223 251	#00DFFB
16.7%	16.7% #00D2F6	RGB 0 210 246	#00D2F6
33.3%	33.3% #00C6F2	RGB 0 198 242	#00C6F2
50.0%	50.0% #00BBEE	RGB 0 187 238	#00BBEE
66.7%	66.7% #00AFE9	RGB 0 175 233	#00AFE9
83.3%	83.3% #00A4E5	RGB 0 164 229	#00A4E5
100.0%	100.0% #009AE1	RGB 0 154 225	#009AE1

#00DFFB #00D2F6 #00C6F2 #00BBEE #00AFE9 #00A4E5 #009AE1

#00DFFB - #00BBEE - #009AE1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #00DFFB 0%, #00BBEE 50%, #009AE1 100%);
    background: -webkit-linear-gradient(top, #00DFFB 0%, #00BBEE 50%, #009AE1 100%);
    background: linear-gradient(to bottom, #00DFFB 0%, #00BBEE 50%, #009AE1 100%);
}
</style>