#4857A8 - #15214C | 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 #4857A8 to #15214C

#4857A8 #15214C

Calculate the color between two colors, #4857A8 and #15214C. 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)

#4857A8 - #15214C | 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 #4857A8 as 0% and #15214C as 100%.

0.0%	0.0% #4857A8	RGB 72 87 168	#4857A8
16.7%	16.7% #3F4E98	RGB 63 78 152	#3F4E98
33.3%	33.3% #374589	RGB 55 69 137	#374589
50.0%	50.0% #2E3C7A	RGB 46 60 122	#2E3C7A
66.7%	66.7% #26336A	RGB 38 51 106	#26336A
83.3%	83.3% #1D2A5B	RGB 29 42 91	#1D2A5B
100.0%	100.0% #15214C	RGB 21 33 76	#15214C

#4857A8 #3F4E98 #374589 #2E3C7A #26336A #1D2A5B #15214C

#4857A8 - #15214C

HSV Blend

#4857A8 - #15214C | 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 #4857A8 as 0% and #15214C as 100%.

0.0%	0.0% #4857A8	RGB 72 87 168	#4857A8
16.7%	16.7% #3D4C98	RGB 61 76 152	#3D4C98
33.3%	33.3% #334389	RGB 51 67 137	#334389
50.0%	50.0% #2A397A	RGB 42 57 122	#2A397A
66.7%	66.7% #22316A	RGB 34 49 106	#22316A
83.3%	83.3% #1B285B	RGB 27 40 91	#1B285B
100.0%	100.0% #15214C	RGB 21 33 76	#15214C

#4857A8 #3D4C98 #334389 #2A397A #22316A #1B285B #15214C

#4857A8 - #2A397A - #15214C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4857A8 0%, #2A397A 50%, #15214C 100%);
    background: -webkit-linear-gradient(top, #4857A8 0%, #2A397A 50%, #15214C 100%);
    background: linear-gradient(to bottom, #4857A8 0%, #2A397A 50%, #15214C 100%);
}
</style>