#00DFEE - #009ACC | 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 #00DFEE to #009ACC

#00DFEE #009ACC

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

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

0.0%	0.0% #00DFEE	RGB 0 223 238	#00DFEE
16.7%	16.7% #00D3E8	RGB 0 211 232	#00D3E8
33.3%	33.3% #00C8E2	RGB 0 200 226	#00C8E2
50.0%	50.0% #00BCDD	RGB 0 188 221	#00BCDD
66.7%	66.7% #00B1D7	RGB 0 177 215	#00B1D7
83.3%	83.3% #00A5D1	RGB 0 165 209	#00A5D1
100.0%	100.0% #009ACC	RGB 0 154 204	#009ACC

#00DFEE #00D3E8 #00C8E2 #00BCDD #00B1D7 #00A5D1 #009ACC

#00DFEE - #009ACC

HSV Blend

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

0.0%	0.0% #00DFEE	RGB 0 223 238	#00DFEE
16.7%	16.7% #00D2E8	RGB 0 210 232	#00D2E8
33.3%	33.3% #00C6E2	RGB 0 198 226	#00C6E2
50.0%	50.0% #00BADD	RGB 0 186 221	#00BADD
66.7%	66.7% #00AFD7	RGB 0 175 215	#00AFD7
83.3%	83.3% #00A4D1	RGB 0 164 209	#00A4D1
100.0%	100.0% #009ACC	RGB 0 154 204	#009ACC

#00DFEE #00D2E8 #00C6E2 #00BADD #00AFD7 #00A4D1 #009ACC

#00DFEE - #00BADD - #009ACC

CSS codes

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

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