#A8BAF7 - #4564C8 | 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 #A8BAF7 to #4564C8

#A8BAF7 #4564C8

Calculate the color between two colors, #A8BAF7 and #4564C8. 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)

#A8BAF7 - #4564C8 | 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 #A8BAF7 as 0% and #4564C8 as 100%.

0.0%	0.0% #A8BAF7	RGB 168 186 247	#A8BAF7
16.7%	16.7% #97ABEF	RGB 151 171 239	#97ABEF
33.3%	33.3% #879DE7	RGB 135 157 231	#879DE7
50.0%	50.0% #768FDF	RGB 118 143 223	#768FDF
66.7%	66.7% #6680D7	RGB 102 128 215	#6680D7
83.3%	83.3% #5572CF	RGB 85 114 207	#5572CF
100.0%	100.0% #4564C8	RGB 69 100 200	#4564C8

#A8BAF7 #97ABEF #879DE7 #768FDF #6680D7 #5572CF #4564C8

#A8BAF7 - #4564C8

HSV Blend

#A8BAF7 - #4564C8 | 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 #A8BAF7 as 0% and #4564C8 as 100%.

0.0%	0.0% #A8BAF7	RGB 168 186 247	#A8BAF7
16.7%	16.7% #95A9EF	RGB 149 169 239	#95A9EF
33.3%	33.3% #839AE7	RGB 131 154 231	#839AE7
50.0%	50.0% #728BDF	RGB 114 139 223	#728BDF
66.7%	66.7% #627DD7	RGB 98 125 215	#627DD7
83.3%	83.3% #5370CF	RGB 83 112 207	#5370CF
100.0%	100.0% #4564C8	RGB 69 100 200	#4564C8

#A8BAF7 #95A9EF #839AE7 #728BDF #627DD7 #5370CF #4564C8

#A8BAF7 - #728BDF - #4564C8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8BAF7 0%, #728BDF 50%, #4564C8 100%);
    background: -webkit-linear-gradient(top, #A8BAF7 0%, #728BDF 50%, #4564C8 100%);
    background: linear-gradient(to bottom, #A8BAF7 0%, #728BDF 50%, #4564C8 100%);
}
</style>