#3E5E5D - #5BA6CC | 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 #3E5E5D to #5BA6CC

#3E5E5D #5BA6CC

Calculate the color between two colors, #3E5E5D and #5BA6CC. 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)

#3E5E5D - #5BA6CC | 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 #3E5E5D as 0% and #5BA6CC as 100%.

0.0%	0.0% #3E5E5D	RGB 62 94 93	#3E5E5D
16.7%	16.7% #426A6F	RGB 66 106 111	#426A6F
33.3%	33.3% #477682	RGB 71 118 130	#477682
50.0%	50.0% #4C8294	RGB 76 130 148	#4C8294
66.7%	66.7% #518EA7	RGB 81 142 167	#518EA7
83.3%	83.3% #569AB9	RGB 86 154 185	#569AB9
100.0%	100.0% #5BA6CC	RGB 91 166 204	#5BA6CC

#3E5E5D #426A6F #477682 #4C8294 #518EA7 #569AB9 #5BA6CC

#3E5E5D - #5BA6CC

HSV Blend

#3E5E5D - #5BA6CC | 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 #3E5E5D as 0% and #5BA6CC as 100%.

0.0%	0.0% #3E5E5D	RGB 62 94 93	#3E5E5D
16.7%	16.7% #466F70	RGB 70 111 112	#466F70
33.3%	33.3% #4C7D82	RGB 76 125 130	#4C7D82
50.0%	50.0% #528A95	RGB 82 138 149	#528A95
66.7%	66.7% #5696A7	RGB 86 150 167	#5696A7
83.3%	83.3% #599FB9	RGB 89 159 185	#599FB9
100.0%	100.0% #5BA6CC	RGB 91 166 204	#5BA6CC

#3E5E5D #466F70 #4C7D82 #528A95 #5696A7 #599FB9 #5BA6CC

#3E5E5D - #528A95 - #5BA6CC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3E5E5D 0%, #528A95 50%, #5BA6CC 100%);
    background: -webkit-linear-gradient(top, #3E5E5D 0%, #528A95 50%, #5BA6CC 100%);
    background: linear-gradient(to bottom, #3E5E5D 0%, #528A95 50%, #5BA6CC 100%);
}
</style>