#3C7B8B - #20353B | 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 #3C7B8B to #20353B

#3C7B8B #20353B

Calculate the color between two colors, #3C7B8B and #20353B. 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)

#3C7B8B - #20353B | 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 #3C7B8B as 0% and #20353B as 100%.

0.0%	0.0% #3C7B8B	RGB 60 123 139	#3C7B8B
16.7%	16.7% #376F7D	RGB 55 111 125	#376F7D
33.3%	33.3% #326370	RGB 50 99 112	#326370
50.0%	50.0% #2E5863	RGB 46 88 99	#2E5863
66.7%	66.7% #294C55	RGB 41 76 85	#294C55
83.3%	83.3% #244048	RGB 36 64 72	#244048
100.0%	100.0% #20353B	RGB 32 53 59	#20353B

#3C7B8B #376F7D #326370 #2E5863 #294C55 #244048 #20353B

#3C7B8B - #20353B

HSV Blend

#3C7B8B - #20353B | 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 #3C7B8B as 0% and #20353B as 100%.

0.0%	0.0% #3C7B8B	RGB 60 123 139	#3C7B8B
16.7%	16.7% #386F7D	RGB 56 111 125	#386F7D
33.3%	33.3% #346370	RGB 52 99 112	#346370
50.0%	50.0% #305863	RGB 48 88 99	#305863
66.7%	66.7% #2B4C55	RGB 43 76 85	#2B4C55
83.3%	83.3% #254048	RGB 37 64 72	#254048
100.0%	100.0% #20353B	RGB 32 53 59	#20353B

#3C7B8B #386F7D #346370 #305863 #2B4C55 #254048 #20353B

#3C7B8B - #305863 - #20353B

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C7B8B 0%, #305863 50%, #20353B 100%);
    background: -webkit-linear-gradient(top, #3C7B8B 0%, #305863 50%, #20353B 100%);
    background: linear-gradient(to bottom, #3C7B8B 0%, #305863 50%, #20353B 100%);
}
</style>