#3E5E87 - #9DA7B0 | 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 #3E5E87 to #9DA7B0

#3E5E87 #9DA7B0

Calculate the color between two colors, #3E5E87 and #9DA7B0. 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)

#3E5E87 - #9DA7B0 | 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 #3E5E87 as 0% and #9DA7B0 as 100%.

0.0%	0.0% #3E5E87	RGB 62 94 135	#3E5E87
16.7%	16.7% #4D6A8D	RGB 77 106 141	#4D6A8D
33.3%	33.3% #5D7694	RGB 93 118 148	#5D7694
50.0%	50.0% #6D829B	RGB 109 130 155	#6D829B
66.7%	66.7% #7D8EA2	RGB 125 142 162	#7D8EA2
83.3%	83.3% #8D9AA9	RGB 141 154 169	#8D9AA9
100.0%	100.0% #9DA7B0	RGB 157 167 176	#9DA7B0

#3E5E87 #4D6A8D #5D7694 #6D829B #7D8EA2 #8D9AA9 #9DA7B0

#3E5E87 - #9DA7B0

HSV Blend

#3E5E87 - #9DA7B0 | 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 #3E5E87 as 0% and #9DA7B0 as 100%.

0.0%	0.0% #3E5E87	RGB 62 94 135	#3E5E87
16.7%	16.7% #4B698D	RGB 75 105 141	#4B698D
33.3%	33.3% #597594	RGB 89 117 148	#597594
50.0%	50.0% #69819B	RGB 105 129 155	#69819B
66.7%	66.7% #798DA2	RGB 121 141 162	#798DA2
83.3%	83.3% #8A9AA9	RGB 138 154 169	#8A9AA9
100.0%	100.0% #9DA7B0	RGB 157 167 176	#9DA7B0

#3E5E87 #4B698D #597594 #69819B #798DA2 #8A9AA9 #9DA7B0

#3E5E87 - #69819B - #9DA7B0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3E5E87 0%, #69819B 50%, #9DA7B0 100%);
    background: -webkit-linear-gradient(top, #3E5E87 0%, #69819B 50%, #9DA7B0 100%);
    background: linear-gradient(to bottom, #3E5E87 0%, #69819B 50%, #9DA7B0 100%);
}
</style>