#A8BDF4 - #4769C4 | 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 #A8BDF4 to #4769C4

#A8BDF4 #4769C4

Calculate the color between two colors, #A8BDF4 and #4769C4. 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)

#A8BDF4 - #4769C4 | 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 #A8BDF4 as 0% and #4769C4 as 100%.

0.0%	0.0% #A8BDF4	RGB 168 189 244	#A8BDF4
16.7%	16.7% #97AFEC	RGB 151 175 236	#97AFEC
33.3%	33.3% #87A1E4	RGB 135 161 228	#87A1E4
50.0%	50.0% #7793DC	RGB 119 147 220	#7793DC
66.7%	66.7% #6785D4	RGB 103 133 212	#6785D4
83.3%	83.3% #5777CC	RGB 87 119 204	#5777CC
100.0%	100.0% #4769C4	RGB 71 105 196	#4769C4

#A8BDF4 #97AFEC #87A1E4 #7793DC #6785D4 #5777CC #4769C4

#A8BDF4 - #4769C4

HSV Blend

#A8BDF4 - #4769C4 | 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 #A8BDF4 as 0% and #4769C4 as 100%.

0.0%	0.0% #A8BDF4	RGB 168 189 244	#A8BDF4
16.7%	16.7% #95ADEC	RGB 149 173 236	#95ADEC
33.3%	33.3% #849EE4	RGB 132 158 228	#849EE4
50.0%	50.0% #7390DC	RGB 115 144 220	#7390DC
66.7%	66.7% #6382D4	RGB 99 130 212	#6382D4
83.3%	83.3% #5475CC	RGB 84 117 204	#5475CC
100.0%	100.0% #4769C4	RGB 71 105 196	#4769C4

#A8BDF4 #95ADEC #849EE4 #7390DC #6382D4 #5475CC #4769C4

#A8BDF4 - #7390DC - #4769C4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8BDF4 0%, #7390DC 50%, #4769C4 100%);
    background: -webkit-linear-gradient(top, #A8BDF4 0%, #7390DC 50%, #4769C4 100%);
    background: linear-gradient(to bottom, #A8BDF4 0%, #7390DC 50%, #4769C4 100%);
}
</style>