#5A8CC7 - #1F417A | 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 #5A8CC7 to #1F417A

#5A8CC7 #1F417A

Calculate the color between two colors, #5A8CC7 and #1F417A. 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)

#5A8CC7 - #1F417A | 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 #5A8CC7 as 0% and #1F417A as 100%.

0.0%	0.0% #5A8CC7	RGB 90 140 199	#5A8CC7
16.7%	16.7% #507FBA	RGB 80 127 186	#507FBA
33.3%	33.3% #4673AD	RGB 70 115 173	#4673AD
50.0%	50.0% #3C66A0	RGB 60 102 160	#3C66A0
66.7%	66.7% #325A93	RGB 50 90 147	#325A93
83.3%	83.3% #284D86	RGB 40 77 134	#284D86
100.0%	100.0% #1F417A	RGB 31 65 122	#1F417A

#5A8CC7 #507FBA #4673AD #3C66A0 #325A93 #284D86 #1F417A

#5A8CC7 - #1F417A

HSV Blend

#5A8CC7 - #1F417A | 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 #5A8CC7 as 0% and #1F417A as 100%.

0.0%	0.0% #5A8CC7	RGB 90 140 199	#5A8CC7
16.7%	16.7% #4E7EBA	RGB 78 126 186	#4E7EBA
33.3%	33.3% #4270AD	RGB 66 112 173	#4270AD
50.0%	50.0% #3863A0	RGB 56 99 160	#3863A0
66.7%	66.7% #2F5793	RGB 47 87 147	#2F5793
83.3%	83.3% #264B86	RGB 38 75 134	#264B86
100.0%	100.0% #1F417A	RGB 31 65 122	#1F417A

#5A8CC7 #4E7EBA #4270AD #3863A0 #2F5793 #264B86 #1F417A

#5A8CC7 - #3863A0 - #1F417A

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5A8CC7 0%, #3863A0 50%, #1F417A 100%);
    background: -webkit-linear-gradient(top, #5A8CC7 0%, #3863A0 50%, #1F417A 100%);
    background: linear-gradient(to bottom, #5A8CC7 0%, #3863A0 50%, #1F417A 100%);
}
</style>