#3C4F90 - #8A99B9 | 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 #3C4F90 to #8A99B9

#3C4F90 #8A99B9

Calculate the color between two colors, #3C4F90 and #8A99B9. 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)

#3C4F90 - #8A99B9 | 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 #3C4F90 as 0% and #8A99B9 as 100%.

0.0%	0.0% #3C4F90	RGB 60 79 144	#3C4F90
16.7%	16.7% #495B96	RGB 73 91 150	#495B96
33.3%	33.3% #56679D	RGB 86 103 157	#56679D
50.0%	50.0% #6374A4	RGB 99 116 164	#6374A4
66.7%	66.7% #7080AB	RGB 112 128 171	#7080AB
83.3%	83.3% #7D8CB2	RGB 125 140 178	#7D8CB2
100.0%	100.0% #8A99B9	RGB 138 153 185	#8A99B9

#3C4F90 #495B96 #56679D #6374A4 #7080AB #7D8CB2 #8A99B9

#3C4F90 - #8A99B9

HSV Blend

#3C4F90 - #8A99B9 | 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 #3C4F90 as 0% and #8A99B9 as 100%.

0.0%	0.0% #3C4F90	RGB 60 79 144	#3C4F90
16.7%	16.7% #475A96	RGB 71 90 150	#475A96
33.3%	33.3% #52669D	RGB 82 102 157	#52669D
50.0%	50.0% #5F72A4	RGB 95 114 164	#5F72A4
66.7%	66.7% #6C7EAB	RGB 108 126 171	#6C7EAB
83.3%	83.3% #7B8BB2	RGB 123 139 178	#7B8BB2
100.0%	100.0% #8A99B9	RGB 138 153 185	#8A99B9

#3C4F90 #475A96 #52669D #5F72A4 #6C7EAB #7B8BB2 #8A99B9

#3C4F90 - #5F72A4 - #8A99B9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C4F90 0%, #5F72A4 50%, #8A99B9 100%);
    background: -webkit-linear-gradient(top, #3C4F90 0%, #5F72A4 50%, #8A99B9 100%);
    background: linear-gradient(to bottom, #3C4F90 0%, #5F72A4 50%, #8A99B9 100%);
}
</style>