#A2BAFF - #2D4CCE | 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 #A2BAFF to #2D4CCE

#A2BAFF #2D4CCE

Calculate the color between two colors, #A2BAFF and #2D4CCE. 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)

#A2BAFF - #2D4CCE | 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 #A2BAFF as 0% and #2D4CCE as 100%.

0.0%	0.0% #A2BAFF	RGB 162 186 255	#A2BAFF
16.7%	16.7% #8EA7F6	RGB 142 167 246	#8EA7F6
33.3%	33.3% #7B95EE	RGB 123 149 238	#7B95EE
50.0%	50.0% #6783E6	RGB 103 131 230	#6783E6
66.7%	66.7% #5470DE	RGB 84 112 222	#5470DE
83.3%	83.3% #405ED6	RGB 64 94 214	#405ED6
100.0%	100.0% #2D4CCE	RGB 45 76 206	#2D4CCE

#A2BAFF #8EA7F6 #7B95EE #6783E6 #5470DE #405ED6 #2D4CCE

#A2BAFF - #2D4CCE

HSV Blend

#A2BAFF - #2D4CCE | 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 #A2BAFF as 0% and #2D4CCE as 100%.

0.0%	0.0% #A2BAFF	RGB 162 186 255	#A2BAFF
16.7%	16.7% #8BA6F6	RGB 139 166 246	#8BA6F6
33.3%	33.3% #7692EE	RGB 118 146 238	#7692EE
50.0%	50.0% #6280E6	RGB 98 128 230	#6280E6
66.7%	66.7% #4F6EDE	RGB 79 110 222	#4F6EDE
83.3%	83.3% #3D5CD6	RGB 61 92 214	#3D5CD6
100.0%	100.0% #2D4CCE	RGB 45 76 206	#2D4CCE

#A2BAFF #8BA6F6 #7692EE #6280E6 #4F6EDE #3D5CD6 #2D4CCE

#A2BAFF - #6280E6 - #2D4CCE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A2BAFF 0%, #6280E6 50%, #2D4CCE 100%);
    background: -webkit-linear-gradient(top, #A2BAFF 0%, #6280E6 50%, #2D4CCE 100%);
    background: linear-gradient(to bottom, #A2BAFF 0%, #6280E6 50%, #2D4CCE 100%);
}
</style>