#A8BCDA - #4E6C9E | 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 #A8BCDA to #4E6C9E

#A8BCDA #4E6C9E

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

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

0.0%	0.0% #A8BCDA	RGB 168 188 218	#A8BCDA
16.7%	16.7% #99AED0	RGB 153 174 208	#99AED0
33.3%	33.3% #8AA1C6	RGB 138 161 198	#8AA1C6
50.0%	50.0% #7B94BC	RGB 123 148 188	#7B94BC
66.7%	66.7% #6C86B2	RGB 108 134 178	#6C86B2
83.3%	83.3% #5D79A8	RGB 93 121 168	#5D79A8
100.0%	100.0% #4E6C9E	RGB 78 108 158	#4E6C9E

#A8BCDA #99AED0 #8AA1C6 #7B94BC #6C86B2 #5D79A8 #4E6C9E

#A8BCDA - #4E6C9E

HSV Blend

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

0.0%	0.0% #A8BCDA	RGB 168 188 218	#A8BCDA
16.7%	16.7% #96ADD0	RGB 150 173 208	#96ADD0
33.3%	33.3% #869FC6	RGB 134 159 198	#869FC6
50.0%	50.0% #7691BC	RGB 118 145 188	#7691BC
66.7%	66.7% #6884B2	RGB 104 132 178	#6884B2
83.3%	83.3% #5A78A8	RGB 90 120 168	#5A78A8
100.0%	100.0% #4E6C9E	RGB 78 108 158	#4E6C9E

#A8BCDA #96ADD0 #869FC6 #7691BC #6884B2 #5A78A8 #4E6C9E

#A8BCDA - #7691BC - #4E6C9E

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8BCDA 0%, #7691BC 50%, #4E6C9E 100%);
    background: -webkit-linear-gradient(top, #A8BCDA 0%, #7691BC 50%, #4E6C9E 100%);
    background: linear-gradient(to bottom, #A8BCDA 0%, #7691BC 50%, #4E6C9E 100%);
}
</style>