#5E63C9 - #98ACE0 | 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 #5E63C9 to #98ACE0

#5E63C9 #98ACE0

Calculate the color between two colors, #5E63C9 and #98ACE0. 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)

#5E63C9 - #98ACE0 | 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 #5E63C9 as 0% and #98ACE0 as 100%.

0.0%	0.0% #5E63C9	RGB 94 99 201	#5E63C9
16.7%	16.7% #676FCC	RGB 103 111 204	#676FCC
33.3%	33.3% #717BD0	RGB 113 123 208	#717BD0
50.0%	50.0% #7B87D4	RGB 123 135 212	#7B87D4
66.7%	66.7% #8493D8	RGB 132 147 216	#8493D8
83.3%	83.3% #8E9FDC	RGB 142 159 220	#8E9FDC
100.0%	100.0% #98ACE0	RGB 152 172 224	#98ACE0

#5E63C9 #676FCC #717BD0 #7B87D4 #8493D8 #8E9FDC #98ACE0

#5E63C9 - #98ACE0

HSV Blend

#5E63C9 - #98ACE0 | 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 #5E63C9 as 0% and #98ACE0 as 100%.

0.0%	0.0% #5E63C9	RGB 94 99 201	#5E63C9
16.7%	16.7% #666FCC	RGB 102 111 204	#666FCC
33.3%	33.3% #707CD0	RGB 112 124 208	#707CD0
50.0%	50.0% #7988D4	RGB 121 136 212	#7988D4
66.7%	66.7% #8394D8	RGB 131 148 216	#8394D8
83.3%	83.3% #8DA0DC	RGB 141 160 220	#8DA0DC
100.0%	100.0% #98ACE0	RGB 152 172 224	#98ACE0

#5E63C9 #666FCC #707CD0 #7988D4 #8394D8 #8DA0DC #98ACE0

#5E63C9 - #7988D4 - #98ACE0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E63C9 0%, #7988D4 50%, #98ACE0 100%);
    background: -webkit-linear-gradient(top, #5E63C9 0%, #7988D4 50%, #98ACE0 100%);
    background: linear-gradient(to bottom, #5E63C9 0%, #7988D4 50%, #98ACE0 100%);
}
</style>