#162A5E - #BCC2D1 | 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 #162A5E to #BCC2D1

#162A5E #BCC2D1

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

#162A5E - #BCC2D1 | 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 #162A5E as 0% and #BCC2D1 as 100%.

0.0%	0.0% #162A5E	RGB 22 42 94	#162A5E
16.7%	16.7% #314371	RGB 49 67 113	#314371
33.3%	33.3% #4D5C84	RGB 77 92 132	#4D5C84
50.0%	50.0% #697697	RGB 105 118 151	#697697
66.7%	66.7% #848FAA	RGB 132 143 170	#848FAA
83.3%	83.3% #A0A8BD	RGB 160 168 189	#A0A8BD
100.0%	100.0% #BCC2D1	RGB 188 194 209	#BCC2D1

#162A5E #314371 #4D5C84 #697697 #848FAA #A0A8BD #BCC2D1

#162A5E - #BCC2D1

HSV Blend

#162A5E - #BCC2D1 | 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 #162A5E as 0% and #BCC2D1 as 100%.

0.0%	0.0% #15295E	RGB 21 41 94	#15295E
16.7%	16.7% #273B71	RGB 39 59 113	#273B71
33.3%	33.3% #3C5084	RGB 60 80 132	#3C5084
50.0%	50.0% #556897	RGB 85 104 151	#556897
66.7%	66.7% #7383AA	RGB 115 131 170	#7383AA
83.3%	83.3% #95A1BD	RGB 149 161 189	#95A1BD
100.0%	100.0% #BCC2D1	RGB 188 194 209	#BCC2D1

#15295E #273B71 #3C5084 #556897 #7383AA #95A1BD #BCC2D1

#162A5E - #556897 - #BCC2D1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #15295E 0%, #556897 50%, #BCC2D1 100%);
    background: -webkit-linear-gradient(top, #15295E 0%, #556897 50%, #BCC2D1 100%);
    background: linear-gradient(to bottom, #15295E 0%, #556897 50%, #BCC2D1 100%);
}
</style>