#0070CE - #61CDF5 | 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 #0070CE to #61CDF5

#0070CE #61CDF5

Calculate the color between two colors, #0070CE and #61CDF5. 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)

#0070CE - #61CDF5 | 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 #0070CE as 0% and #61CDF5 as 100%.

0.0%	0.0% #0070CE	RGB 0 112 206	#0070CE
16.7%	16.7% #107FD4	RGB 16 127 212	#107FD4
33.3%	33.3% #208FDB	RGB 32 143 219	#208FDB
50.0%	50.0% #309EE1	RGB 48 158 225	#309EE1
66.7%	66.7% #40AEE8	RGB 64 174 232	#40AEE8
83.3%	83.3% #50BDEE	RGB 80 189 238	#50BDEE
100.0%	100.0% #61CDF5	RGB 97 205 245	#61CDF5

#0070CE #107FD4 #208FDB #309EE1 #40AEE8 #50BDEE #61CDF5

#0070CE - #61CDF5

HSV Blend

#0070CE - #61CDF5 | 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 #0070CE as 0% and #61CDF5 as 100%.

0.0%	0.0% #0070CE	RGB 0 112 206	#0070CE
16.7%	16.7% #0E80D4	RGB 14 128 212	#0E80D4
33.3%	33.3% #1C90DB	RGB 28 144 219	#1C90DB
50.0%	50.0% #2C9FE1	RGB 44 159 225	#2C9FE1
66.7%	66.7% #3DAFE8	RGB 61 175 232	#3DAFE8
83.3%	83.3% #4EBEEE	RGB 78 190 238	#4EBEEE
100.0%	100.0% #61CDF5	RGB 97 205 245	#61CDF5

#0070CE #0E80D4 #1C90DB #2C9FE1 #3DAFE8 #4EBEEE #61CDF5

#0070CE - #2C9FE1 - #61CDF5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0070CE 0%, #2C9FE1 50%, #61CDF5 100%);
    background: -webkit-linear-gradient(top, #0070CE 0%, #2C9FE1 50%, #61CDF5 100%);
    background: linear-gradient(to bottom, #0070CE 0%, #2C9FE1 50%, #61CDF5 100%);
}
</style>