#8C8C8C - #357A5C | 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 #8C8C8C to #357A5C

#8C8C8C #357A5C

Calculate the color between two colors, #8C8C8C and #357A5C. 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)

#8C8C8C - #357A5C | 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 #8C8C8C as 0% and #357A5C as 100%.

0.0%	0.0% #8C8C8C	RGB 140 140 140	#8C8C8C
16.7%	16.7% #7D8984	RGB 125 137 132	#7D8984
33.3%	33.3% #6F867C	RGB 111 134 124	#6F867C
50.0%	50.0% #608374	RGB 96 131 116	#608374
66.7%	66.7% #52806C	RGB 82 128 108	#52806C
83.3%	83.3% #437D64	RGB 67 125 100	#437D64
100.0%	100.0% #357A5C	RGB 53 122 92	#357A5C

#8C8C8C #7D8984 #6F867C #608374 #52806C #437D64 #357A5C

#8C8C8C - #357A5C

HSV Blend

#8C8C8C - #357A5C | 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 #8C8C8C as 0% and #357A5C as 100%.

0.0%	0.0% #8C8C8C	RGB 140 140 140	#8C8C8C
16.7%	16.7% #89817C	RGB 137 129 124	#89817C
33.3%	33.3% #86826C	RGB 134 130 108	#86826C
50.0%	50.0% #78835D	RGB 120 131 93	#78835D
66.7%	66.7% #5D804F	RGB 93 128 79	#5D804F
83.3%	83.3% #427D4A	RGB 66 125 74	#427D4A
100.0%	100.0% #357A5C	RGB 53 122 92	#357A5C

#8C8C8C #89817C #86826C #78835D #5D804F #427D4A #357A5C

#8C8C8C - #78835D - #357A5C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8C8C8C 0%, #78835D 50%, #357A5C 100%);
    background: -webkit-linear-gradient(top, #8C8C8C 0%, #78835D 50%, #357A5C 100%);
    background: linear-gradient(to bottom, #8C8C8C 0%, #78835D 50%, #357A5C 100%);
}
</style>