#4875B2 - #ABE2B5 | 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 #4875B2 to #ABE2B5

#4875B2 #ABE2B5

Calculate the color between two colors, #4875B2 and #ABE2B5. 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)

#4875B2 - #ABE2B5 | 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 #4875B2 as 0% and #ABE2B5 as 100%.

0.0%	0.0% #4875B2	RGB 72 117 178	#4875B2
16.7%	16.7% #5887B2	RGB 88 135 178	#5887B2
33.3%	33.3% #6999B3	RGB 105 153 179	#6999B3
50.0%	50.0% #79ABB3	RGB 121 171 179	#79ABB3
66.7%	66.7% #8ABDB4	RGB 138 189 180	#8ABDB4
83.3%	83.3% #9ACFB4	RGB 154 207 180	#9ACFB4
100.0%	100.0% #ABE2B5	RGB 171 226 181	#ABE2B5

#4875B2 #5887B2 #6999B3 #79ABB3 #8ABDB4 #9ACFB4 #ABE2B5

#4875B2 - #ABE2B5

HSV Blend

#4875B2 - #ABE2B5 | 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 #4875B2 as 0% and #ABE2B5 as 100%.

0.0%	0.0% #4875B2	RGB 72 117 178	#4875B2
16.7%	16.7% #5697BA	RGB 86 151 186	#5697BA
33.3%	33.3% #65B7C2	RGB 101 183 194	#65B7C2
50.0%	50.0% #75CABF	RGB 117 202 191	#75CABF
66.7%	66.7% #86D2B7	RGB 134 210 183	#86D2B7
83.3%	83.3% #98DAB3	RGB 152 218 179	#98DAB3
100.0%	100.0% #ABE2B5	RGB 171 226 181	#ABE2B5

#4875B2 #5697BA #65B7C2 #75CABF #86D2B7 #98DAB3 #ABE2B5

#4875B2 - #75CABF - #ABE2B5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4875B2 0%, #75CABF 50%, #ABE2B5 100%);
    background: -webkit-linear-gradient(top, #4875B2 0%, #75CABF 50%, #ABE2B5 100%);
    background: linear-gradient(to bottom, #4875B2 0%, #75CABF 50%, #ABE2B5 100%);
}
</style>