#3C6284 - #8C9FAE | 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 #3C6284 to #8C9FAE

#3C6284 #8C9FAE

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

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

0.0%	0.0% #3C6284	RGB 60 98 132	#3C6284
16.7%	16.7% #496C8B	RGB 73 108 139	#496C8B
33.3%	33.3% #567692	RGB 86 118 146	#567692
50.0%	50.0% #648099	RGB 100 128 153	#648099
66.7%	66.7% #718AA0	RGB 113 138 160	#718AA0
83.3%	83.3% #7E94A7	RGB 126 148 167	#7E94A7
100.0%	100.0% #8C9FAE	RGB 140 159 174	#8C9FAE

#3C6284 #496C8B #567692 #648099 #718AA0 #7E94A7 #8C9FAE

#3C6284 - #8C9FAE

HSV Blend

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

0.0%	0.0% #3C6284	RGB 60 98 132	#3C6284
16.7%	16.7% #476B8B	RGB 71 107 139	#476B8B
33.3%	33.3% #537592	RGB 83 117 146	#537592
50.0%	50.0% #607F99	RGB 96 127 153	#607F99
66.7%	66.7% #6E89A0	RGB 110 137 160	#6E89A0
83.3%	83.3% #7C94A7	RGB 124 148 167	#7C94A7
100.0%	100.0% #8C9FAE	RGB 140 159 174	#8C9FAE

#3C6284 #476B8B #537592 #607F99 #6E89A0 #7C94A7 #8C9FAE

#3C6284 - #607F99 - #8C9FAE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C6284 0%, #607F99 50%, #8C9FAE 100%);
    background: -webkit-linear-gradient(top, #3C6284 0%, #607F99 50%, #8C9FAE 100%);
    background: linear-gradient(to bottom, #3C6284 0%, #607F99 50%, #8C9FAE 100%);
}
</style>