#9DB6DA - #3E6D9B | 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 #9DB6DA to #3E6D9B

#9DB6DA #3E6D9B

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

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

0.0%	0.0% #9DB6DA	RGB 157 182 218	#9DB6DA
16.7%	16.7% #8DA9CF	RGB 141 169 207	#8DA9CF
33.3%	33.3% #7D9DC5	RGB 125 157 197	#7D9DC5
50.0%	50.0% #6D91BA	RGB 109 145 186	#6D91BA
66.7%	66.7% #5D85B0	RGB 93 133 176	#5D85B0
83.3%	83.3% #4D79A5	RGB 77 121 165	#4D79A5
100.0%	100.0% #3E6D9B	RGB 62 109 155	#3E6D9B

#9DB6DA #8DA9CF #7D9DC5 #6D91BA #5D85B0 #4D79A5 #3E6D9B

#9DB6DA - #3E6D9B

HSV Blend

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

0.0%	0.0% #9DB6DA	RGB 157 182 218	#9DB6DA
16.7%	16.7% #8AA7CF	RGB 138 167 207	#8AA7CF
33.3%	33.3% #789AC5	RGB 120 154 197	#789AC5
50.0%	50.0% #688EBA	RGB 104 142 186	#688EBA
66.7%	66.7% #5982B0	RGB 89 130 176	#5982B0
83.3%	83.3% #4B77A5	RGB 75 119 165	#4B77A5
100.0%	100.0% #3E6D9B	RGB 62 109 155	#3E6D9B

#9DB6DA #8AA7CF #789AC5 #688EBA #5982B0 #4B77A5 #3E6D9B

#9DB6DA - #688EBA - #3E6D9B

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #9DB6DA 0%, #688EBA 50%, #3E6D9B 100%);
    background: -webkit-linear-gradient(top, #9DB6DA 0%, #688EBA 50%, #3E6D9B 100%);
    background: linear-gradient(to bottom, #9DB6DA 0%, #688EBA 50%, #3E6D9B 100%);
}
</style>