#344A5E - #81838B | 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 #344A5E to #81838B

#344A5E #81838B

Calculate the color between two colors, #344A5E and #81838B. 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)

#344A5E - #81838B | 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 #344A5E as 0% and #81838B as 100%.

0.0%	0.0% #344A5E	RGB 52 74 94	#344A5E
16.7%	16.7% #405365	RGB 64 83 101	#405365
33.3%	33.3% #4D5D6D	RGB 77 93 109	#4D5D6D
50.0%	50.0% #5A6674	RGB 90 102 116	#5A6674
66.7%	66.7% #67707C	RGB 103 112 124	#67707C
83.3%	83.3% #747983	RGB 116 121 131	#747983
100.0%	100.0% #81838B	RGB 129 131 139	#81838B

#344A5E #405365 #4D5D6D #5A6674 #67707C #747983 #81838B

#344A5E - #81838B

HSV Blend

#344A5E - #81838B | 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 #344A5E as 0% and #81838B as 100%.

0.0%	0.0% #344A5E	RGB 52 74 94	#344A5E
16.7%	16.7% #3E5065	RGB 62 80 101	#3E5065
33.3%	33.3% #49586D	RGB 73 88 109	#49586D
50.0%	50.0% #566174	RGB 86 97 116	#566174
66.7%	66.7% #636B7C	RGB 99 107 124	#636B7C
83.3%	83.3% #717683	RGB 113 118 131	#717683
100.0%	100.0% #81838B	RGB 129 131 139	#81838B

#344A5E #3E5065 #49586D #566174 #636B7C #717683 #81838B

#344A5E - #566174 - #81838B

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #344A5E 0%, #566174 50%, #81838B 100%);
    background: -webkit-linear-gradient(top, #344A5E 0%, #566174 50%, #81838B 100%);
    background: linear-gradient(to bottom, #344A5E 0%, #566174 50%, #81838B 100%);
}
</style>