#4C7EB6 - #AEC2CE | 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 #4C7EB6 to #AEC2CE

#4C7EB6 #AEC2CE

Calculate the color between two colors, #4C7EB6 and #AEC2CE. 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)

#4C7EB6 - #AEC2CE | 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 #4C7EB6 as 0% and #AEC2CE as 100%.

0.0%	0.0% #4C7EB6	RGB 76 126 182	#4C7EB6
16.7%	16.7% #5C89BA	RGB 92 137 186	#5C89BA
33.3%	33.3% #6C94BE	RGB 108 148 190	#6C94BE
50.0%	50.0% #7DA0C2	RGB 125 160 194	#7DA0C2
66.7%	66.7% #8DABC6	RGB 141 171 198	#8DABC6
83.3%	83.3% #9DB6CA	RGB 157 182 202	#9DB6CA
100.0%	100.0% #AEC2CE	RGB 174 194 206	#AEC2CE

#4C7EB6 #5C89BA #6C94BE #7DA0C2 #8DABC6 #9DB6CA #AEC2CE

#4C7EB6 - #AEC2CE

HSV Blend

#4C7EB6 - #AEC2CE | 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 #4C7EB6 as 0% and #AEC2CE as 100%.

0.0%	0.0% #4C7EB6	RGB 76 126 182	#4C7EB6
16.7%	16.7% #5A8ABA	RGB 90 138 186	#5A8ABA
33.3%	33.3% #6A96BE	RGB 106 150 190	#6A96BE
50.0%	50.0% #7AA1C2	RGB 122 161 194	#7AA1C2
66.7%	66.7% #8BACC6	RGB 139 172 198	#8BACC6
83.3%	83.3% #9CB7CA	RGB 156 183 202	#9CB7CA
100.0%	100.0% #AEC2CE	RGB 174 194 206	#AEC2CE

#4C7EB6 #5A8ABA #6A96BE #7AA1C2 #8BACC6 #9CB7CA #AEC2CE

#4C7EB6 - #7AA1C2 - #AEC2CE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4C7EB6 0%, #7AA1C2 50%, #AEC2CE 100%);
    background: -webkit-linear-gradient(top, #4C7EB6 0%, #7AA1C2 50%, #AEC2CE 100%);
    background: linear-gradient(to bottom, #4C7EB6 0%, #7AA1C2 50%, #AEC2CE 100%);
}
</style>