#5E7AB1 - #20355F | 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 #5E7AB1 to #20355F

#5E7AB1 #20355F

Calculate the color between two colors, #5E7AB1 and #20355F. 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)

#5E7AB1 - #20355F | 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 #5E7AB1 as 0% and #20355F as 100%.

0.0%	0.0% #5E7AB1	RGB 94 122 177	#5E7AB1
16.7%	16.7% #536EA3	RGB 83 110 163	#536EA3
33.3%	33.3% #496395	RGB 73 99 149	#496395
50.0%	50.0% #3F5788	RGB 63 87 136	#3F5788
66.7%	66.7% #344C7A	RGB 52 76 122	#344C7A
83.3%	83.3% #2A406C	RGB 42 64 108	#2A406C
100.0%	100.0% #20355F	RGB 32 53 95	#20355F

#5E7AB1 #536EA3 #496395 #3F5788 #344C7A #2A406C #20355F

#5E7AB1 - #20355F

HSV Blend

#5E7AB1 - #20355F | 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 #5E7AB1 as 0% and #20355F as 100%.

0.0%	0.0% #5E7AB1	RGB 94 122 177	#5E7AB1
16.7%	16.7% #516DA3	RGB 81 109 163	#516DA3
33.3%	33.3% #456095	RGB 69 96 149	#456095
50.0%	50.0% #3B5488	RGB 59 84 136	#3B5488
66.7%	66.7% #31497A	RGB 49 73 122	#31497A
83.3%	83.3% #283F6C	RGB 40 63 108	#283F6C
100.0%	100.0% #20355F	RGB 32 53 95	#20355F

#5E7AB1 #516DA3 #456095 #3B5488 #31497A #283F6C #20355F

#5E7AB1 - #3B5488 - #20355F

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E7AB1 0%, #3B5488 50%, #20355F 100%);
    background: -webkit-linear-gradient(top, #5E7AB1 0%, #3B5488 50%, #20355F 100%);
    background: linear-gradient(to bottom, #5E7AB1 0%, #3B5488 50%, #20355F 100%);
}
</style>