#AAB7FF - #445ED4 | 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 #AAB7FF to #445ED4

#AAB7FF #445ED4

Calculate the color between two colors, #AAB7FF and #445ED4. 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)

#AAB7FF - #445ED4 | 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 #AAB7FF as 0% and #445ED4 as 100%.

0.0%	0.0% #AAB7FF	RGB 170 183 255	#AAB7FF
16.7%	16.7% #99A8F7	RGB 153 168 247	#99A8F7
33.3%	33.3% #8899F0	RGB 136 153 240	#8899F0
50.0%	50.0% #778AE9	RGB 119 138 233	#778AE9
66.7%	66.7% #667BE2	RGB 102 123 226	#667BE2
83.3%	83.3% #556CDB	RGB 85 108 219	#556CDB
100.0%	100.0% #445ED4	RGB 68 94 212	#445ED4

#AAB7FF #99A8F7 #8899F0 #778AE9 #667BE2 #556CDB #445ED4

#AAB7FF - #445ED4

HSV Blend

#AAB7FF - #445ED4 | 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 #AAB7FF as 0% and #445ED4 as 100%.

0.0%	0.0% #AAB7FF	RGB 170 183 255	#AAB7FF
16.7%	16.7% #96A6F7	RGB 150 166 247	#96A6F7
33.3%	33.3% #8496F0	RGB 132 150 240	#8496F0
50.0%	50.0% #7386E9	RGB 115 134 233	#7386E9
66.7%	66.7% #6278E2	RGB 98 120 226	#6278E2
83.3%	83.3% #526ADB	RGB 82 106 219	#526ADB
100.0%	100.0% #445ED4	RGB 68 94 212	#445ED4

#AAB7FF #96A6F7 #8496F0 #7386E9 #6278E2 #526ADB #445ED4

#AAB7FF - #7386E9 - #445ED4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AAB7FF 0%, #7386E9 50%, #445ED4 100%);
    background: -webkit-linear-gradient(top, #AAB7FF 0%, #7386E9 50%, #445ED4 100%);
    background: linear-gradient(to bottom, #AAB7FF 0%, #7386E9 50%, #445ED4 100%);
}
</style>