#3E447B - #8889A4 | 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 #3E447B to #8889A4

#3E447B #8889A4

Calculate the color between two colors, #3E447B and #8889A4. 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)

#3E447B - #8889A4 | 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 #3E447B as 0% and #8889A4 as 100%.

0.0%	0.0% #3E447B	RGB 62 68 123	#3E447B
16.7%	16.7% #4A4F81	RGB 74 79 129	#4A4F81
33.3%	33.3% #565B88	RGB 86 91 136	#565B88
50.0%	50.0% #63668F	RGB 99 102 143	#63668F
66.7%	66.7% #6F7296	RGB 111 114 150	#6F7296
83.3%	83.3% #7B7D9D	RGB 123 125 157	#7B7D9D
100.0%	100.0% #8889A4	RGB 136 137 164	#8889A4

#3E447B #4A4F81 #565B88 #63668F #6F7296 #7B7D9D #8889A4

#3E447B - #8889A4

HSV Blend

#3E447B - #8889A4 | 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 #3E447B as 0% and #8889A4 as 100%.

0.0%	0.0% #3E447B	RGB 62 68 123	#3E447B
16.7%	16.7% #484D81	RGB 72 77 129	#484D81
33.3%	33.3% #535788	RGB 83 87 136	#535788
50.0%	50.0% #5F628F	RGB 95 98 143	#5F628F
66.7%	66.7% #6C6E96	RGB 108 110 150	#6C6E96
83.3%	83.3% #797B9D	RGB 121 123 157	#797B9D
100.0%	100.0% #8889A4	RGB 136 137 164	#8889A4

#3E447B #484D81 #535788 #5F628F #6C6E96 #797B9D #8889A4

#3E447B - #5F628F - #8889A4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3E447B 0%, #5F628F 50%, #8889A4 100%);
    background: -webkit-linear-gradient(top, #3E447B 0%, #5F628F 50%, #8889A4 100%);
    background: linear-gradient(to bottom, #3E447B 0%, #5F628F 50%, #8889A4 100%);
}
</style>