#3C4F5E - #609BCF | 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 #3C4F5E to #609BCF

#3C4F5E #609BCF

Calculate the color between two colors, #3C4F5E and #609BCF. 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)

#3C4F5E - #609BCF | 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 #3C4F5E as 0% and #609BCF as 100%.

0.0%	0.0% #3C4F5E	RGB 60 79 94	#3C4F5E
16.7%	16.7% #425B70	RGB 66 91 112	#425B70
33.3%	33.3% #486883	RGB 72 104 131	#486883
50.0%	50.0% #4E7596	RGB 78 117 150	#4E7596
66.7%	66.7% #5481A9	RGB 84 129 169	#5481A9
83.3%	83.3% #5A8EBC	RGB 90 142 188	#5A8EBC
100.0%	100.0% #609BCF	RGB 96 155 207	#609BCF

#3C4F5E #425B70 #486883 #4E7596 #5481A9 #5A8EBC #609BCF

#3C4F5E - #609BCF

HSV Blend

#3C4F5E - #609BCF | 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 #3C4F5E as 0% and #609BCF as 100%.

0.0%	0.0% #3C4F5E	RGB 60 79 94	#3C4F5E
16.7%	16.7% #445D70	RGB 68 93 112	#445D70
33.3%	33.3% #4C6A83	RGB 76 106 131	#4C6A83
50.0%	50.0% #527796	RGB 82 119 150	#527796
66.7%	66.7% #5884A9	RGB 88 132 169	#5884A9
83.3%	83.3% #5C8FBC	RGB 92 143 188	#5C8FBC
100.0%	100.0% #609BCF	RGB 96 155 207	#609BCF

#3C4F5E #445D70 #4C6A83 #527796 #5884A9 #5C8FBC #609BCF

#3C4F5E - #527796 - #609BCF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C4F5E 0%, #527796 50%, #609BCF 100%);
    background: -webkit-linear-gradient(top, #3C4F5E 0%, #527796 50%, #609BCF 100%);
    background: linear-gradient(to bottom, #3C4F5E 0%, #527796 50%, #609BCF 100%);
}
</style>