#7E7EE2 - #ABC0E9 | 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 #7E7EE2 to #ABC0E9

#7E7EE2 #ABC0E9

Calculate the color between two colors, #7E7EE2 and #ABC0E9. 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)

#7E7EE2 - #ABC0E9 | 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 #7E7EE2 as 0% and #ABC0E9 as 100%.

0.0%	0.0% #7E7EE2	RGB 126 126 226	#7E7EE2
16.7%	16.7% #8589E3	RGB 133 137 227	#8589E3
33.3%	33.3% #8D94E4	RGB 141 148 228	#8D94E4
50.0%	50.0% #949FE5	RGB 148 159 229	#949FE5
66.7%	66.7% #9CAAE6	RGB 156 170 230	#9CAAE6
83.3%	83.3% #A3B5E7	RGB 163 181 231	#A3B5E7
100.0%	100.0% #ABC0E9	RGB 171 192 233	#ABC0E9

#7E7EE2 #8589E3 #8D94E4 #949FE5 #9CAAE6 #A3B5E7 #ABC0E9

#7E7EE2 - #ABC0E9

HSV Blend

#7E7EE2 - #ABC0E9 | 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 #7E7EE2 as 0% and #ABC0E9 as 100%.

0.0%	0.0% #7E7EE2	RGB 126 126 226	#7E7EE2
16.7%	16.7% #858AE3	RGB 133 138 227	#858AE3
33.3%	33.3% #8C96E4	RGB 140 150 228	#8C96E4
50.0%	50.0% #94A1E5	RGB 148 161 229	#94A1E5
66.7%	66.7% #9BACE6	RGB 155 172 230	#9BACE6
83.3%	83.3% #A3B6E7	RGB 163 182 231	#A3B6E7
100.0%	100.0% #ABC0E9	RGB 171 192 233	#ABC0E9

#7E7EE2 #858AE3 #8C96E4 #94A1E5 #9BACE6 #A3B6E7 #ABC0E9

#7E7EE2 - #94A1E5 - #ABC0E9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #7E7EE2 0%, #94A1E5 50%, #ABC0E9 100%);
    background: -webkit-linear-gradient(top, #7E7EE2 0%, #94A1E5 50%, #ABC0E9 100%);
    background: linear-gradient(to bottom, #7E7EE2 0%, #94A1E5 50%, #ABC0E9 100%);
}
</style>