#A8BDD9 - #4F6D9D | 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 #A8BDD9 to #4F6D9D

#A8BDD9 #4F6D9D

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

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

0.0%	0.0% #A8BDD9	RGB 168 189 217	#A8BDD9
16.7%	16.7% #99AFCF	RGB 153 175 207	#99AFCF
33.3%	33.3% #8AA2C5	RGB 138 162 197	#8AA2C5
50.0%	50.0% #7B95BB	RGB 123 149 187	#7B95BB
66.7%	66.7% #6C87B1	RGB 108 135 177	#6C87B1
83.3%	83.3% #5D7AA7	RGB 93 122 167	#5D7AA7
100.0%	100.0% #4F6D9D	RGB 79 109 157	#4F6D9D

#A8BDD9 #99AFCF #8AA2C5 #7B95BB #6C87B1 #5D7AA7 #4F6D9D

#A8BDD9 - #4F6D9D

HSV Blend

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

0.0%	0.0% #A8BDD9	RGB 168 189 217	#A8BDD9
16.7%	16.7% #96AECF	RGB 150 174 207	#96AECF
33.3%	33.3% #86A0C5	RGB 134 160 197	#86A0C5
50.0%	50.0% #7792BB	RGB 119 146 187	#7792BB
66.7%	66.7% #6985B1	RGB 105 133 177	#6985B1
83.3%	83.3% #5B79A7	RGB 91 121 167	#5B79A7
100.0%	100.0% #4F6D9D	RGB 79 109 157	#4F6D9D

#A8BDD9 #96AECF #86A0C5 #7792BB #6985B1 #5B79A7 #4F6D9D

#A8BDD9 - #7792BB - #4F6D9D

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8BDD9 0%, #7792BB 50%, #4F6D9D 100%);
    background: -webkit-linear-gradient(top, #A8BDD9 0%, #7792BB 50%, #4F6D9D 100%);
    background: linear-gradient(to bottom, #A8BDD9 0%, #7792BB 50%, #4F6D9D 100%);
}
</style>