#5E63BA - #9EAAD3 | 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 #5E63BA to #9EAAD3

#5E63BA #9EAAD3

Calculate the color between two colors, #5E63BA and #9EAAD3. 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)

#5E63BA - #9EAAD3 | 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 #5E63BA as 0% and #9EAAD3 as 100%.

0.0%	0.0% #5E63BA	RGB 94 99 186	#5E63BA
16.7%	16.7% #686EBE	RGB 104 110 190	#686EBE
33.3%	33.3% #737AC2	RGB 115 122 194	#737AC2
50.0%	50.0% #7E86C6	RGB 126 134 198	#7E86C6
66.7%	66.7% #8892CA	RGB 136 146 202	#8892CA
83.3%	83.3% #939ECE	RGB 147 158 206	#939ECE
100.0%	100.0% #9EAAD3	RGB 158 170 211	#9EAAD3

#5E63BA #686EBE #737AC2 #7E86C6 #8892CA #939ECE #9EAAD3

#5E63BA - #9EAAD3

HSV Blend

#5E63BA - #9EAAD3 | 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 #5E63BA as 0% and #9EAAD3 as 100%.

0.0%	0.0% #5E63BA	RGB 94 99 186	#5E63BA
16.7%	16.7% #676EBE	RGB 103 110 190	#676EBE
33.3%	33.3% #717AC2	RGB 113 122 194	#717AC2
50.0%	50.0% #7C86C6	RGB 124 134 198	#7C86C6
66.7%	66.7% #8792CA	RGB 135 146 202	#8792CA
83.3%	83.3% #929ECE	RGB 146 158 206	#929ECE
100.0%	100.0% #9EAAD3	RGB 158 170 211	#9EAAD3

#5E63BA #676EBE #717AC2 #7C86C6 #8792CA #929ECE #9EAAD3

#5E63BA - #7C86C6 - #9EAAD3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E63BA 0%, #7C86C6 50%, #9EAAD3 100%);
    background: -webkit-linear-gradient(top, #5E63BA 0%, #7C86C6 50%, #9EAAD3 100%);
    background: linear-gradient(to bottom, #5E63BA 0%, #7C86C6 50%, #9EAAD3 100%);
}
</style>