#4A88EB - #B7A8FF | 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 #4A88EB to #B7A8FF

#4A88EB #B7A8FF

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

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

0.0%	0.0% #4A88EB	RGB 74 136 235	#4A88EB
16.7%	16.7% #5C8DEE	RGB 92 141 238	#5C8DEE
33.3%	33.3% #6E92F1	RGB 110 146 241	#6E92F1
50.0%	50.0% #8098F5	RGB 128 152 245	#8098F5
66.7%	66.7% #929DF8	RGB 146 157 248	#929DF8
83.3%	83.3% #A4A2FB	RGB 164 162 251	#A4A2FB
100.0%	100.0% #B7A8FF	RGB 183 168 255	#B7A8FF

#4A88EB #5C8DEE #6E92F1 #8098F5 #929DF8 #A4A2FB #B7A8FF

#4A88EB - #B7A8FF

HSV Blend

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

0.0%	0.0% #4A88EB	RGB 74 136 235	#4A88EB
16.7%	16.7% #5884EE	RGB 88 132 238	#5884EE
33.3%	33.3% #6783F1	RGB 103 131 241	#6783F1
50.0%	50.0% #7784F5	RGB 119 132 245	#7784F5
66.7%	66.7% #8788F8	RGB 135 136 248	#8788F8
83.3%	83.3% #9F97FB	RGB 159 151 251	#9F97FB
100.0%	100.0% #B7A8FF	RGB 183 168 255	#B7A8FF

#4A88EB #5884EE #6783F1 #7784F5 #8788F8 #9F97FB #B7A8FF

#4A88EB - #7784F5 - #B7A8FF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4A88EB 0%, #7784F5 50%, #B7A8FF 100%);
    background: -webkit-linear-gradient(top, #4A88EB 0%, #7784F5 50%, #B7A8FF 100%);
    background: linear-gradient(to bottom, #4A88EB 0%, #7784F5 50%, #B7A8FF 100%);
}
</style>