#2FA1D9 - #0076AC | 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 #2FA1D9 to #0076AC

#2FA1D9 #0076AC

Calculate the color between two colors, #2FA1D9 and #0076AC. 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)

#2FA1D9 - #0076AC | 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 #2FA1D9 as 0% and #0076AC as 100%.

0.0%	0.0% #2FA1D9	RGB 47 161 217	#2FA1D9
16.7%	16.7% #2799D1	RGB 39 153 209	#2799D1
33.3%	33.3% #1F92CA	RGB 31 146 202	#1F92CA
50.0%	50.0% #178BC2	RGB 23 139 194	#178BC2
66.7%	66.7% #0F84BB	RGB 15 132 187	#0F84BB
83.3%	83.3% #077DB3	RGB 7 125 179	#077DB3
100.0%	100.0% #0076AC	RGB 0 118 172	#0076AC

#2FA1D9 #2799D1 #1F92CA #178BC2 #0F84BB #077DB3 #0076AC

#2FA1D9 - #0076AC

HSV Blend

#2FA1D9 - #0076AC | 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 #2FA1D9 as 0% and #0076AC as 100%.

0.0%	0.0% #2FA1D9	RGB 47 161 217	#2FA1D9
16.7%	16.7% #2599D1	RGB 37 153 209	#2599D1
33.3%	33.3% #1D91CA	RGB 29 145 202	#1D91CA
50.0%	50.0% #158AC2	RGB 21 138 194	#158AC2
66.7%	66.7% #0D83BB	RGB 13 131 187	#0D83BB
83.3%	83.3% #067CB3	RGB 6 124 179	#067CB3
100.0%	100.0% #0076AC	RGB 0 118 172	#0076AC

#2FA1D9 #2599D1 #1D91CA #158AC2 #0D83BB #067CB3 #0076AC

#2FA1D9 - #158AC2 - #0076AC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2FA1D9 0%, #158AC2 50%, #0076AC 100%);
    background: -webkit-linear-gradient(top, #2FA1D9 0%, #158AC2 50%, #0076AC 100%);
    background: linear-gradient(to bottom, #2FA1D9 0%, #158AC2 50%, #0076AC 100%);
}
</style>