#ABAFEC - #4D51B8 | 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 #ABAFEC to #4D51B8

#ABAFEC #4D51B8

Calculate the color between two colors, #ABAFEC and #4D51B8. 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)

#ABAFEC - #4D51B8 | 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 #ABAFEC as 0% and #4D51B8 as 100%.

0.0%	0.0% #ABAFEC	RGB 171 175 236	#ABAFEC
16.7%	16.7% #9B9FE3	RGB 155 159 227	#9B9FE3
33.3%	33.3% #8B8FDA	RGB 139 143 218	#8B8FDA
50.0%	50.0% #7C80D2	RGB 124 128 210	#7C80D2
66.7%	66.7% #6C70C9	RGB 108 112 201	#6C70C9
83.3%	83.3% #5C60C0	RGB 92 96 192	#5C60C0
100.0%	100.0% #4D51B8	RGB 77 81 184	#4D51B8

#ABAFEC #9B9FE3 #8B8FDA #7C80D2 #6C70C9 #5C60C0 #4D51B8

#ABAFEC - #4D51B8

HSV Blend

#ABAFEC - #4D51B8 | 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 #ABAFEC as 0% and #4D51B8 as 100%.

0.0%	0.0% #ABAEEC	RGB 171 174 236	#ABAEEC
16.7%	16.7% #999DE3	RGB 153 157 227	#999DE3
33.3%	33.3% #888CDA	RGB 136 140 218	#888CDA
50.0%	50.0% #787CD2	RGB 120 124 210	#787CD2
66.7%	66.7% #686DC9	RGB 104 109 201	#686DC9
83.3%	83.3% #5A5EC0	RGB 90 94 192	#5A5EC0
100.0%	100.0% #4D51B8	RGB 77 81 184	#4D51B8

#ABAEEC #999DE3 #888CDA #787CD2 #686DC9 #5A5EC0 #4D51B8

#ABAFEC - #787CD2 - #4D51B8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ABAEEC 0%, #787CD2 50%, #4D51B8 100%);
    background: -webkit-linear-gradient(top, #ABAEEC 0%, #787CD2 50%, #4D51B8 100%);
    background: linear-gradient(to bottom, #ABAEEC 0%, #787CD2 50%, #4D51B8 100%);
}
</style>