#4D6A8D - #AFB0B0 | 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 #4D6A8D to #AFB0B0

#4D6A8D #AFB0B0

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

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

0.0%	0.0% #4D6A8D	RGB 77 106 141	#4D6A8D
16.7%	16.7% #5D7592	RGB 93 117 146	#5D7592
33.3%	33.3% #6D8198	RGB 109 129 152	#6D8198
50.0%	50.0% #7E8D9E	RGB 126 141 158	#7E8D9E
66.7%	66.7% #8E98A4	RGB 142 152 164	#8E98A4
83.3%	83.3% #9EA4AA	RGB 158 164 170	#9EA4AA
100.0%	100.0% #AFB0B0	RGB 175 176 176	#AFB0B0

#4D6A8D #5D7592 #6D8198 #7E8D9E #8E98A4 #9EA4AA #AFB0B0

#4D6A8D - #AFB0B0

HSV Blend

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

0.0%	0.0% #4D6A8D	RGB 77 106 141	#4D6A8D
16.7%	16.7% #5B7992	RGB 91 121 146	#5B7992
33.3%	33.3% #6A8798	RGB 106 135 152	#6A8798
50.0%	50.0% #7A949E	RGB 122 148 158	#7A949E
66.7%	66.7% #8A9FA4	RGB 138 159 164	#8A9FA4
83.3%	83.3% #9CA8AA	RGB 156 168 170	#9CA8AA
100.0%	100.0% #AFB0B0	RGB 175 176 176	#AFB0B0

#4D6A8D #5B7992 #6A8798 #7A949E #8A9FA4 #9CA8AA #AFB0B0

#4D6A8D - #7A949E - #AFB0B0

CSS codes

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

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