#3C4747 - #6D9CB6 | 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 #3C4747 to #6D9CB6

#3C4747 #6D9CB6

Calculate the color between two colors, #3C4747 and #6D9CB6. 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)

#3C4747 - #6D9CB6 | 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 #3C4747 as 0% and #6D9CB6 as 100%.

0.0%	0.0% #3C4747	RGB 60 71 71	#3C4747
16.7%	16.7% #445559	RGB 68 85 89	#445559
33.3%	33.3% #4C636C	RGB 76 99 108	#4C636C
50.0%	50.0% #54717E	RGB 84 113 126	#54717E
66.7%	66.7% #5C7F91	RGB 92 127 145	#5C7F91
83.3%	83.3% #648DA3	RGB 100 141 163	#648DA3
100.0%	100.0% #6D9CB6	RGB 109 156 182	#6D9CB6

#3C4747 #445559 #4C636C #54717E #5C7F91 #648DA3 #6D9CB6

#3C4747 - #6D9CB6

HSV Blend

#3C4747 - #6D9CB6 | 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 #3C4747 as 0% and #6D9CB6 as 100%.

0.0%	0.0% #3C4747	RGB 60 71 71	#3C4747
16.7%	16.7% #475859	RGB 71 88 89	#475859
33.3%	33.3% #52686C	RGB 82 104 108	#52686C
50.0%	50.0% #5B787E	RGB 91 120 126	#5B787E
66.7%	66.7% #628691	RGB 98 134 145	#628691
83.3%	83.3% #6892A3	RGB 104 146 163	#6892A3
100.0%	100.0% #6D9CB6	RGB 109 156 182	#6D9CB6

#3C4747 #475859 #52686C #5B787E #628691 #6892A3 #6D9CB6

#3C4747 - #5B787E - #6D9CB6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C4747 0%, #5B787E 50%, #6D9CB6 100%);
    background: -webkit-linear-gradient(top, #3C4747 0%, #5B787E 50%, #6D9CB6 100%);
    background: linear-gradient(to bottom, #3C4747 0%, #5B787E 50%, #6D9CB6 100%);
}
</style>