#2EB9F5 - #006CC4 | 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 #2EB9F5 to #006CC4

#2EB9F5 #006CC4

Calculate the color between two colors, #2EB9F5 and #006CC4. 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)

#2EB9F5 - #006CC4 | 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 #2EB9F5 as 0% and #006CC4 as 100%.

0.0%	0.0% #2EB9F5	RGB 46 185 245	#2EB9F5
16.7%	16.7% #26ACEC	RGB 38 172 236	#26ACEC
33.3%	33.3% #1E9FE4	RGB 30 159 228	#1E9FE4
50.0%	50.0% #1792DC	RGB 23 146 220	#1792DC
66.7%	66.7% #0F85D4	RGB 15 133 212	#0F85D4
83.3%	83.3% #0778CC	RGB 7 120 204	#0778CC
100.0%	100.0% #006CC4	RGB 0 108 196	#006CC4

#2EB9F5 #26ACEC #1E9FE4 #1792DC #0F85D4 #0778CC #006CC4

#2EB9F5 - #006CC4

HSV Blend

#2EB9F5 - #006CC4 | 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 #2EB9F5 as 0% and #006CC4 as 100%.

0.0%	0.0% #2EB9F5	RGB 46 185 245	#2EB9F5
16.7%	16.7% #25ABEC	RGB 37 171 236	#25ABEC
33.3%	33.3% #1C9EE4	RGB 28 158 228	#1C9EE4
50.0%	50.0% #1491DC	RGB 20 145 220	#1491DC
66.7%	66.7% #0D84D4	RGB 13 132 212	#0D84D4
83.3%	83.3% #0678CC	RGB 6 120 204	#0678CC
100.0%	100.0% #006CC4	RGB 0 108 196	#006CC4

#2EB9F5 #25ABEC #1C9EE4 #1491DC #0D84D4 #0678CC #006CC4

#2EB9F5 - #1491DC - #006CC4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2EB9F5 0%, #1491DC 50%, #006CC4 100%);
    background: -webkit-linear-gradient(top, #2EB9F5 0%, #1491DC 50%, #006CC4 100%);
    background: linear-gradient(to bottom, #2EB9F5 0%, #1491DC 50%, #006CC4 100%);
}
</style>