#3C5C5C - #66A8C6 | 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 #3C5C5C to #66A8C6

#3C5C5C #66A8C6

Calculate the color between two colors, #3C5C5C and #66A8C6. 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)

#3C5C5C - #66A8C6 | 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 #3C5C5C as 0% and #66A8C6 as 100%.

0.0%	0.0% #3C5C5C	RGB 60 92 92	#3C5C5C
16.7%	16.7% #43686D	RGB 67 104 109	#43686D
33.3%	33.3% #4A757F	RGB 74 117 127	#4A757F
50.0%	50.0% #518291	RGB 81 130 145	#518291
66.7%	66.7% #588EA2	RGB 88 142 162	#588EA2
83.3%	83.3% #5F9BB4	RGB 95 155 180	#5F9BB4
100.0%	100.0% #66A8C6	RGB 102 168 198	#66A8C6

#3C5C5C #43686D #4A757F #518291 #588EA2 #5F9BB4 #66A8C6

#3C5C5C - #66A8C6

HSV Blend

#3C5C5C - #66A8C6 | 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 #3C5C5C as 0% and #66A8C6 as 100%.

0.0%	0.0% #3C5C5C	RGB 60 92 92	#3C5C5C
16.7%	16.7% #456B6D	RGB 69 107 109	#456B6D
33.3%	33.3% #4D7A7F	RGB 77 122 127	#4D7A7F
50.0%	50.0% #548791	RGB 84 135 145	#548791
66.7%	66.7% #5B93A2	RGB 91 147 162	#5B93A2
83.3%	83.3% #619EB4	RGB 97 158 180	#619EB4
100.0%	100.0% #66A8C6	RGB 102 168 198	#66A8C6

#3C5C5C #456B6D #4D7A7F #548791 #5B93A2 #619EB4 #66A8C6

#3C5C5C - #548791 - #66A8C6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C5C5C 0%, #548791 50%, #66A8C6 100%);
    background: -webkit-linear-gradient(top, #3C5C5C 0%, #548791 50%, #66A8C6 100%);
    background: linear-gradient(to bottom, #3C5C5C 0%, #548791 50%, #66A8C6 100%);
}
</style>