#5E7DBB - #8376FF | 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 #5E7DBB to #8376FF

#5E7DBB #8376FF

Calculate the color between two colors, #5E7DBB and #8376FF. 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)

#5E7DBB - #8376FF | 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 #5E7DBB as 0% and #8376FF as 100%.

0.0%	0.0% #5E7DBB	RGB 94 125 187	#5E7DBB
16.7%	16.7% #647BC6	RGB 100 123 198	#647BC6
33.3%	33.3% #6A7AD1	RGB 106 122 209	#6A7AD1
50.0%	50.0% #7079DD	RGB 112 121 221	#7079DD
66.7%	66.7% #7678E8	RGB 118 120 232	#7678E8
83.3%	83.3% #7C77F3	RGB 124 119 243	#7C77F3
100.0%	100.0% #8376FF	RGB 131 118 255	#8376FF

#5E7DBB #647BC6 #6A7AD1 #7079DD #7678E8 #7C77F3 #8376FF

#5E7DBB - #8376FF

HSV Blend

#5E7DBB - #8376FF | 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 #5E7DBB as 0% and #8376FF as 100%.

0.0%	0.0% #5E7DBB	RGB 94 125 187	#5E7DBB
16.7%	16.7% #627CC6	RGB 98 124 198	#627CC6
33.3%	33.3% #667BD1	RGB 102 123 209	#667BD1
50.0%	50.0% #6A78DD	RGB 106 120 221	#6A78DD
66.7%	66.7% #6E74E8	RGB 110 116 232	#6E74E8
83.3%	83.3% #7572F3	RGB 117 114 243	#7572F3
100.0%	100.0% #8376FF	RGB 131 118 255	#8376FF

#5E7DBB #627CC6 #667BD1 #6A78DD #6E74E8 #7572F3 #8376FF

#5E7DBB - #6A78DD - #8376FF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E7DBB 0%, #6A78DD 50%, #8376FF 100%);
    background: -webkit-linear-gradient(top, #5E7DBB 0%, #6A78DD 50%, #8376FF 100%);
    background: linear-gradient(to bottom, #5E7DBB 0%, #6A78DD 50%, #8376FF 100%);
}
</style>