#7ACEFF - #2AB7EC | 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 #7ACEFF to #2AB7EC

#7ACEFF #2AB7EC

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

#7ACEFF - #2AB7EC | 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 #7ACEFF as 0% and #2AB7EC as 100%.

0.0%	0.0% #7ACEFF	RGB 122 206 255	#7ACEFF
16.7%	16.7% #6CCAFB	RGB 108 202 251	#6CCAFB
33.3%	33.3% #5FC6F8	RGB 95 198 248	#5FC6F8
50.0%	50.0% #52C2F5	RGB 82 194 245	#52C2F5
66.7%	66.7% #44BEF2	RGB 68 190 242	#44BEF2
83.3%	83.3% #37BAEF	RGB 55 186 239	#37BAEF
100.0%	100.0% #2AB7EC	RGB 42 183 236	#2AB7EC

#7ACEFF #6CCAFB #5FC6F8 #52C2F5 #44BEF2 #37BAEF #2AB7EC

#7ACEFF - #2AB7EC

HSV Blend

#7ACEFF - #2AB7EC | 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 #7ACEFF as 0% and #2AB7EC as 100%.

0.0%	0.0% #7ACEFF	RGB 122 206 255	#7ACEFF
16.7%	16.7% #6BC9FB	RGB 107 201 251	#6BC9FB
33.3%	33.3% #5EC4F8	RGB 94 196 248	#5EC4F8
50.0%	50.0% #50C0F5	RGB 80 192 245	#50C0F5
66.7%	66.7% #43BCF2	RGB 67 188 242	#43BCF2
83.3%	83.3% #36B9EF	RGB 54 185 239	#36B9EF
100.0%	100.0% #2AB7EC	RGB 42 183 236	#2AB7EC

#7ACEFF #6BC9FB #5EC4F8 #50C0F5 #43BCF2 #36B9EF #2AB7EC

#7ACEFF - #50C0F5 - #2AB7EC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #7ACEFF 0%, #50C0F5 50%, #2AB7EC 100%);
    background: -webkit-linear-gradient(top, #7ACEFF 0%, #50C0F5 50%, #2AB7EC 100%);
    background: linear-gradient(to bottom, #7ACEFF 0%, #50C0F5 50%, #2AB7EC 100%);
}
</style>