#5E86C4 - #203C76 | 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 #5E86C4 to #203C76

#5E86C4 #203C76

Calculate the color between two colors, #5E86C4 and #203C76. 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)

#5E86C4 - #203C76 | 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 #5E86C4 as 0% and #203C76 as 100%.

0.0%	0.0% #5E86C4	RGB 94 134 196	#5E86C4
16.7%	16.7% #5379B7	RGB 83 121 183	#5379B7
33.3%	33.3% #496DAA	RGB 73 109 170	#496DAA
50.0%	50.0% #3F619D	RGB 63 97 157	#3F619D
66.7%	66.7% #345490	RGB 52 84 144	#345490
83.3%	83.3% #2A4883	RGB 42 72 131	#2A4883
100.0%	100.0% #203C76	RGB 32 60 118	#203C76

#5E86C4 #5379B7 #496DAA #3F619D #345490 #2A4883 #203C76

#5E86C4 - #203C76

HSV Blend

#5E86C4 - #203C76 | 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 #5E86C4 as 0% and #203C76 as 100%.

0.0%	0.0% #5E85C4	RGB 94 133 196	#5E85C4
16.7%	16.7% #5178B7	RGB 81 120 183	#5178B7
33.3%	33.3% #456AAA	RGB 69 106 170	#456AAA
50.0%	50.0% #3A5E9D	RGB 58 94 157	#3A5E9D
66.7%	66.7% #315290	RGB 49 82 144	#315290
83.3%	83.3% #284683	RGB 40 70 131	#284683
100.0%	100.0% #203C76	RGB 32 60 118	#203C76

#5E85C4 #5178B7 #456AAA #3A5E9D #315290 #284683 #203C76

#5E86C4 - #3A5E9D - #203C76

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E85C4 0%, #3A5E9D 50%, #203C76 100%);
    background: -webkit-linear-gradient(top, #5E85C4 0%, #3A5E9D 50%, #203C76 100%);
    background: linear-gradient(to bottom, #5E85C4 0%, #3A5E9D 50%, #203C76 100%);
}
</style>