#4D99AB - #224D5E | 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 #4D99AB to #224D5E

#4D99AB #224D5E

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

#4D99AB - #224D5E | 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 #4D99AB as 0% and #224D5E as 100%.

0.0%	0.0% #4D99AB	RGB 77 153 171	#4D99AB
16.7%	16.7% #458C9E	RGB 69 140 158	#458C9E
33.3%	33.3% #3E7F91	RGB 62 127 145	#3E7F91
50.0%	50.0% #377384	RGB 55 115 132	#377384
66.7%	66.7% #306677	RGB 48 102 119	#306677
83.3%	83.3% #29596A	RGB 41 89 106	#29596A
100.0%	100.0% #224D5E	RGB 34 77 94	#224D5E

#4D99AB #458C9E #3E7F91 #377384 #306677 #29596A #224D5E

#4D99AB - #224D5E

HSV Blend

#4D99AB - #224D5E | 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 #4D99AB as 0% and #224D5E as 100%.

0.0%	0.0% #4D99AB	RGB 77 153 171	#4D99AB
16.7%	16.7% #448B9E	RGB 68 139 158	#448B9E
33.3%	33.3% #3D7E91	RGB 61 126 145	#3D7E91
50.0%	50.0% #357184	RGB 53 113 132	#357184
66.7%	66.7% #2E6577	RGB 46 101 119	#2E6577
83.3%	83.3% #28586A	RGB 40 88 106	#28586A
100.0%	100.0% #224D5E	RGB 34 77 94	#224D5E

#4D99AB #448B9E #3D7E91 #357184 #2E6577 #28586A #224D5E

#4D99AB - #357184 - #224D5E

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4D99AB 0%, #357184 50%, #224D5E 100%);
    background: -webkit-linear-gradient(top, #4D99AB 0%, #357184 50%, #224D5E 100%);
    background: linear-gradient(to bottom, #4D99AB 0%, #357184 50%, #224D5E 100%);
}
</style>