#AAAAFF - #414ED2 | 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 #AAAAFF to #414ED2

#AAAAFF #414ED2

Calculate the color between two colors, #AAAAFF and #414ED2. 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)

#AAAAFF - #414ED2 | 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 #AAAAFF as 0% and #414ED2 as 100%.

0.0%	0.0% #AAAAFF	RGB 170 170 255	#AAAAFF
16.7%	16.7% #989AF7	RGB 152 154 247	#989AF7
33.3%	33.3% #878BF0	RGB 135 139 240	#878BF0
50.0%	50.0% #757CE8	RGB 117 124 232	#757CE8
66.7%	66.7% #646CE1	RGB 100 108 225	#646CE1
83.3%	83.3% #525DD9	RGB 82 93 217	#525DD9
100.0%	100.0% #414ED2	RGB 65 78 210	#414ED2

#AAAAFF #989AF7 #878BF0 #757CE8 #646CE1 #525DD9 #414ED2

#AAAAFF - #414ED2

HSV Blend

#AAAAFF - #414ED2 | 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 #AAAAFF as 0% and #414ED2 as 100%.

0.0%	0.0% #AAAAFF	RGB 170 170 255	#AAAAFF
16.7%	16.7% #9697F7	RGB 150 151 247	#9697F7
33.3%	33.3% #8386F0	RGB 131 134 240	#8386F0
50.0%	50.0% #7176E8	RGB 113 118 232	#7176E8
66.7%	66.7% #6068E1	RGB 96 104 225	#6068E1
83.3%	83.3% #505AD9	RGB 80 90 217	#505AD9
100.0%	100.0% #414ED2	RGB 65 78 210	#414ED2

#AAAAFF #9697F7 #8386F0 #7176E8 #6068E1 #505AD9 #414ED2

#AAAAFF - #7176E8 - #414ED2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AAAAFF 0%, #7176E8 50%, #414ED2 100%);
    background: -webkit-linear-gradient(top, #AAAAFF 0%, #7176E8 50%, #414ED2 100%);
    background: linear-gradient(to bottom, #AAAAFF 0%, #7176E8 50%, #414ED2 100%);
}
</style>