#5C666C - #102F5E | 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 #5C666C to #102F5E

#5C666C #102F5E

Calculate the color between two colors, #5C666C and #102F5E. 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)

#5C666C - #102F5E | 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 #5C666C as 0% and #102F5E as 100%.

0.0%	0.0% #5C666C	RGB 92 102 108	#5C666C
16.7%	16.7% #4F5C69	RGB 79 92 105	#4F5C69
33.3%	33.3% #425367	RGB 66 83 103	#425367
50.0%	50.0% #364A65	RGB 54 74 101	#364A65
66.7%	66.7% #294162	RGB 41 65 98	#294162
83.3%	83.3% #1C3860	RGB 28 56 96	#1C3860
100.0%	100.0% #102F5E	RGB 16 47 94	#102F5E

#5C666C #4F5C69 #425367 #364A65 #294162 #1C3860 #102F5E

#5C666C - #102F5E

HSV Blend

#5C666C - #102F5E | 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 #5C666C as 0% and #102F5E as 100%.

0.0%	0.0% #5C666C	RGB 92 102 108	#5C666C
16.7%	16.7% #4E5E69	RGB 78 94 105	#4E5E69
33.3%	33.3% #405567	RGB 64 85 103	#405567
50.0%	50.0% #334C65	RGB 51 76 101	#334C65
66.7%	66.7% #274362	RGB 39 67 98	#274362
83.3%	83.3% #1B3960	RGB 27 57 96	#1B3960
100.0%	100.0% #102F5E	RGB 16 47 94	#102F5E

#5C666C #4E5E69 #405567 #334C65 #274362 #1B3960 #102F5E

#5C666C - #334C65 - #102F5E

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5C666C 0%, #334C65 50%, #102F5E 100%);
    background: -webkit-linear-gradient(top, #5C666C 0%, #334C65 50%, #102F5E 100%);
    background: linear-gradient(to bottom, #5C666C 0%, #334C65 50%, #102F5E 100%);
}
</style>