#ABABCB - #4A5E89 | 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 #ABABCB to #4A5E89

#ABABCB #4A5E89

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

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

0.0%	0.0% #ABABCB	RGB 171 171 203	#ABABCB
16.7%	16.7% #9A9EC0	RGB 154 158 192	#9A9EC0
33.3%	33.3% #8A91B5	RGB 138 145 181	#8A91B5
50.0%	50.0% #7A84AA	RGB 122 132 170	#7A84AA
66.7%	66.7% #6A779F	RGB 106 119 159	#6A779F
83.3%	83.3% #5A6A94	RGB 90 106 148	#5A6A94
100.0%	100.0% #4A5E89	RGB 74 94 137	#4A5E89

#ABABCB #9A9EC0 #8A91B5 #7A84AA #6A779F #5A6A94 #4A5E89

#ABABCB - #4A5E89

HSV Blend

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

0.0%	0.0% #ABABCB	RGB 171 171 203	#ABABCB
16.7%	16.7% #989AC0	RGB 152 154 192	#989AC0
33.3%	33.3% #868BB5	RGB 134 139 181	#868BB5
50.0%	50.0% #757DAA	RGB 117 125 170	#757DAA
66.7%	66.7% #65719F	RGB 101 113 159	#65719F
83.3%	83.3% #576794	RGB 87 103 148	#576794
100.0%	100.0% #4A5E89	RGB 74 94 137	#4A5E89

#ABABCB #989AC0 #868BB5 #757DAA #65719F #576794 #4A5E89

#ABABCB - #757DAA - #4A5E89

CSS codes

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

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