#355B5E - #5CA3C4 | 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 #355B5E to #5CA3C4

#355B5E #5CA3C4

Calculate the color between two colors, #355B5E and #5CA3C4. 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)

#355B5E - #5CA3C4 | 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 #355B5E as 0% and #5CA3C4 as 100%.

0.0%	0.0% #355B5E	RGB 53 91 94	#355B5E
16.7%	16.7% #3B676F	RGB 59 103 111	#3B676F
33.3%	33.3% #427380	RGB 66 115 128	#427380
50.0%	50.0% #487F91	RGB 72 127 145	#487F91
66.7%	66.7% #4F8BA2	RGB 79 139 162	#4F8BA2
83.3%	83.3% #5597B3	RGB 85 151 179	#5597B3
100.0%	100.0% #5CA3C4	RGB 92 163 196	#5CA3C4

#355B5E #3B676F #427380 #487F91 #4F8BA2 #5597B3 #5CA3C4

#355B5E - #5CA3C4

HSV Blend

#355B5E - #5CA3C4 | 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 #355B5E as 0% and #5CA3C4 as 100%.

0.0%	0.0% #355B5E	RGB 53 91 94	#355B5E
16.7%	16.7% #3C696F	RGB 60 105 111	#3C696F
33.3%	33.3% #447680	RGB 68 118 128	#447680
50.0%	50.0% #4A8391	RGB 74 131 145	#4A8391
66.7%	66.7% #518EA2	RGB 81 142 162	#518EA2
83.3%	83.3% #5699B3	RGB 86 153 179	#5699B3
100.0%	100.0% #5CA3C4	RGB 92 163 196	#5CA3C4

#355B5E #3C696F #447680 #4A8391 #518EA2 #5699B3 #5CA3C4

#355B5E - #4A8391 - #5CA3C4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #355B5E 0%, #4A8391 50%, #5CA3C4 100%);
    background: -webkit-linear-gradient(top, #355B5E 0%, #4A8391 50%, #5CA3C4 100%);
    background: linear-gradient(to bottom, #355B5E 0%, #4A8391 50%, #5CA3C4 100%);
}
</style>