#2B2D3C - #557E83 | 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 #2B2D3C to #557E83

#2B2D3C #557E83

Calculate the color between two colors, #2B2D3C and #557E83. 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)

#2B2D3C - #557E83 | 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 #2B2D3C as 0% and #557E83 as 100%.

0.0%	0.0% #2B2D3C	RGB 43 45 60	#2B2D3C
16.7%	16.7% #323A47	RGB 50 58 71	#323A47
33.3%	33.3% #394853	RGB 57 72 83	#394853
50.0%	50.0% #40555F	RGB 64 85 95	#40555F
66.7%	66.7% #47636B	RGB 71 99 107	#47636B
83.3%	83.3% #4E7077	RGB 78 112 119	#4E7077
100.0%	100.0% #557E83	RGB 85 126 131	#557E83

#2B2D3C #323A47 #394853 #40555F #47636B #4E7077 #557E83

#2B2D3C - #557E83

HSV Blend

#2B2D3C - #557E83 | 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 #2B2D3C as 0% and #557E83 as 100%.

0.0%	0.0% #2B2D3C	RGB 43 45 60	#2B2D3C
16.7%	16.7% #323747	RGB 50 55 71	#323747
33.3%	33.3% #3A4353	RGB 58 67 83	#3A4353
50.0%	50.0% #41505F	RGB 65 80 95	#41505F
66.7%	66.7% #485E6B	RGB 72 94 107	#485E6B
83.3%	83.3% #4E6D77	RGB 78 109 119	#4E6D77
100.0%	100.0% #557E83	RGB 85 126 131	#557E83

#2B2D3C #323747 #3A4353 #41505F #485E6B #4E6D77 #557E83

#2B2D3C - #41505F - #557E83

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2B2D3C 0%, #41505F 50%, #557E83 100%);
    background: -webkit-linear-gradient(top, #2B2D3C 0%, #41505F 50%, #557E83 100%);
    background: linear-gradient(to bottom, #2B2D3C 0%, #41505F 50%, #557E83 100%);
}
</style>