#414C76 - #5E9CEE | 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 #414C76 to #5E9CEE

#414C76 #5E9CEE

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

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

0.0%	0.0% #414C76	RGB 65 76 118	#414C76
16.7%	16.7% #45598A	RGB 69 89 138	#45598A
33.3%	33.3% #4A669E	RGB 74 102 158	#4A669E
50.0%	50.0% #4F74B2	RGB 79 116 178	#4F74B2
66.7%	66.7% #5481C6	RGB 84 129 198	#5481C6
83.3%	83.3% #598EDA	RGB 89 142 218	#598EDA
100.0%	100.0% #5E9CEE	RGB 94 156 238	#5E9CEE

#414C76 #45598A #4A669E #4F74B2 #5481C6 #598EDA #5E9CEE

#414C76 - #5E9CEE

HSV Blend

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

0.0%	0.0% #414B76	RGB 65 75 118	#414B76
16.7%	16.7% #48588A	RGB 72 88 138	#48588A
33.3%	33.3% #4E659E	RGB 78 101 158	#4E659E
50.0%	50.0% #5472B2	RGB 84 114 178	#5472B2
66.7%	66.7% #587FC6	RGB 88 127 198	#587FC6
83.3%	83.3% #5B8DDA	RGB 91 141 218	#5B8DDA
100.0%	100.0% #5E9CEE	RGB 94 156 238	#5E9CEE

#414B76 #48588A #4E659E #5472B2 #587FC6 #5B8DDA #5E9CEE

#414C76 - #5472B2 - #5E9CEE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #414B76 0%, #5472B2 50%, #5E9CEE 100%);
    background: -webkit-linear-gradient(top, #414B76 0%, #5472B2 50%, #5E9CEE 100%);
    background: linear-gradient(to bottom, #414B76 0%, #5472B2 50%, #5E9CEE 100%);
}
</style>