#3E649C - #9BAEC1 | 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 #3E649C to #9BAEC1

#3E649C #9BAEC1

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

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

0.0%	0.0% #3E649C	RGB 62 100 156	#3E649C
16.7%	16.7% #4D70A2	RGB 77 112 162	#4D70A2
33.3%	33.3% #5D7CA8	RGB 93 124 168	#5D7CA8
50.0%	50.0% #6C89AE	RGB 108 137 174	#6C89AE
66.7%	66.7% #7C95B4	RGB 124 149 180	#7C95B4
83.3%	83.3% #8BA1BA	RGB 139 161 186	#8BA1BA
100.0%	100.0% #9BAEC1	RGB 155 174 193	#9BAEC1

#3E649C #4D70A2 #5D7CA8 #6C89AE #7C95B4 #8BA1BA #9BAEC1

#3E649C - #9BAEC1

HSV Blend

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

0.0%	0.0% #3E649C	RGB 62 100 156	#3E649C
16.7%	16.7% #4B6FA2	RGB 75 111 162	#4B6FA2
33.3%	33.3% #597BA8	RGB 89 123 168	#597BA8
50.0%	50.0% #6888AE	RGB 104 136 174	#6888AE
66.7%	66.7% #7894B4	RGB 120 148 180	#7894B4
83.3%	83.3% #89A1BA	RGB 137 161 186	#89A1BA
100.0%	100.0% #9BAEC1	RGB 155 174 193	#9BAEC1

#3E649C #4B6FA2 #597BA8 #6888AE #7894B4 #89A1BA #9BAEC1

#3E649C - #6888AE - #9BAEC1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3E649C 0%, #6888AE 50%, #9BAEC1 100%);
    background: -webkit-linear-gradient(top, #3E649C 0%, #6888AE 50%, #9BAEC1 100%);
    background: linear-gradient(to bottom, #3E649C 0%, #6888AE 50%, #9BAEC1 100%);
}
</style>