#8A8F9D - #314F52 | 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 #8A8F9D to #314F52

#8A8F9D #314F52

Calculate the color between two colors, #8A8F9D and #314F52. 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)

#8A8F9D - #314F52 | 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 #8A8F9D as 0% and #314F52 as 100%.

0.0%	0.0% #8A8F9D	RGB 138 143 157	#8A8F9D
16.7%	16.7% #7B8490	RGB 123 132 144	#7B8490
33.3%	33.3% #6C7984	RGB 108 121 132	#6C7984
50.0%	50.0% #5D6F77	RGB 93 111 119	#5D6F77
66.7%	66.7% #4E646B	RGB 78 100 107	#4E646B
83.3%	83.3% #3F595E	RGB 63 89 94	#3F595E
100.0%	100.0% #314F52	RGB 49 79 82	#314F52

#8A8F9D #7B8490 #6C7984 #5D6F77 #4E646B #3F595E #314F52

#8A8F9D - #314F52

HSV Blend

#8A8F9D - #314F52 | 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 #8A8F9D as 0% and #314F52 as 100%.

0.0%	0.0% #8A8F9D	RGB 138 143 157	#8A8F9D
16.7%	16.7% #788190	RGB 120 129 144	#788190
33.3%	33.3% #677584	RGB 103 117 132	#677584
50.0%	50.0% #586A77	RGB 88 106 119	#586A77
66.7%	66.7% #49606B	RGB 73 96 107	#49606B
83.3%	83.3% #3C575E	RGB 60 87 94	#3C575E
100.0%	100.0% #314F52	RGB 49 79 82	#314F52

#8A8F9D #788190 #677584 #586A77 #49606B #3C575E #314F52

#8A8F9D - #586A77 - #314F52

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8A8F9D 0%, #586A77 50%, #314F52 100%);
    background: -webkit-linear-gradient(top, #8A8F9D 0%, #586A77 50%, #314F52 100%);
    background: linear-gradient(to bottom, #8A8F9D 0%, #586A77 50%, #314F52 100%);
}
</style>