#214E5E - #3773BA | 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 #214E5E to #3773BA

#214E5E #3773BA

Calculate the color between two colors, #214E5E and #3773BA. 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)

#214E5E - #3773BA | 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 #214E5E as 0% and #3773BA as 100%.

0.0%	0.0% #214E5E	RGB 33 78 94	#214E5E
16.7%	16.7% #24546D	RGB 36 84 109	#24546D
33.3%	33.3% #285A7C	RGB 40 90 124	#285A7C
50.0%	50.0% #2C608C	RGB 44 96 140	#2C608C
66.7%	66.7% #2F669B	RGB 47 102 155	#2F669B
83.3%	83.3% #336CAA	RGB 51 108 170	#336CAA
100.0%	100.0% #3773BA	RGB 55 115 186	#3773BA

#214E5E #24546D #285A7C #2C608C #2F669B #336CAA #3773BA

#214E5E - #3773BA

HSV Blend

#214E5E - #3773BA | 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 #214E5E as 0% and #3773BA as 100%.

0.0%	0.0% #214E5E	RGB 33 78 94	#214E5E
16.7%	16.7% #25576D	RGB 37 87 109	#25576D
33.3%	33.3% #295F7C	RGB 41 95 124	#295F7C
50.0%	50.0% #2D658C	RGB 45 101 140	#2D658C
66.7%	66.7% #306B9B	RGB 48 107 155	#306B9B
83.3%	83.3% #346FAA	RGB 52 111 170	#346FAA
100.0%	100.0% #3773BA	RGB 55 115 186	#3773BA

#214E5E #25576D #295F7C #2D658C #306B9B #346FAA #3773BA

#214E5E - #2D658C - #3773BA

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #214E5E 0%, #2D658C 50%, #3773BA 100%);
    background: -webkit-linear-gradient(top, #214E5E 0%, #2D658C 50%, #3773BA 100%);
    background: linear-gradient(to bottom, #214E5E 0%, #2D658C 50%, #3773BA 100%);
}
</style>