#ABABCA - #4A5E87 | 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 #ABABCA to #4A5E87

#ABABCA #4A5E87

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

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

0.0%	0.0% #ABABCA	RGB 171 171 202	#ABABCA
16.7%	16.7% #9A9EBE	RGB 154 158 190	#9A9EBE
33.3%	33.3% #8A91B3	RGB 138 145 179	#8A91B3
50.0%	50.0% #7A84A8	RGB 122 132 168	#7A84A8
66.7%	66.7% #6A779D	RGB 106 119 157	#6A779D
83.3%	83.3% #5A6A92	RGB 90 106 146	#5A6A92
100.0%	100.0% #4A5E87	RGB 74 94 135	#4A5E87

#ABABCA #9A9EBE #8A91B3 #7A84A8 #6A779D #5A6A92 #4A5E87

#ABABCA - #4A5E87

HSV Blend

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

0.0%	0.0% #ABABCA	RGB 171 171 202	#ABABCA
16.7%	16.7% #989ABE	RGB 152 154 190	#989ABE
33.3%	33.3% #868BB3	RGB 134 139 179	#868BB3
50.0%	50.0% #757DA8	RGB 117 125 168	#757DA8
66.7%	66.7% #65729D	RGB 101 114 157	#65729D
83.3%	83.3% #576792	RGB 87 103 146	#576792
100.0%	100.0% #4A5E87	RGB 74 94 135	#4A5E87

#ABABCA #989ABE #868BB3 #757DA8 #65729D #576792 #4A5E87

#ABABCA - #757DA8 - #4A5E87

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ABABCA 0%, #757DA8 50%, #4A5E87 100%);
    background: -webkit-linear-gradient(top, #ABABCA 0%, #757DA8 50%, #4A5E87 100%);
    background: linear-gradient(to bottom, #ABABCA 0%, #757DA8 50%, #4A5E87 100%);
}
</style>