#0048A8 - #48A5E8 | 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 #0048A8 to #48A5E8

#0048A8 #48A5E8

Calculate the color between two colors, #0048A8 and #48A5E8. 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)

#0048A8 - #48A5E8 | 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 #0048A8 as 0% and #48A5E8 as 100%.

0.0%	0.0% #0048A8	RGB 0 72 168	#0048A8
16.7%	16.7% #0C57B2	RGB 12 87 178	#0C57B2
33.3%	33.3% #1867BD	RGB 24 103 189	#1867BD
50.0%	50.0% #2476C8	RGB 36 118 200	#2476C8
66.7%	66.7% #3086D2	RGB 48 134 210	#3086D2
83.3%	83.3% #3C95DD	RGB 60 149 221	#3C95DD
100.0%	100.0% #48A5E8	RGB 72 165 232	#48A5E8

#0048A8 #0C57B2 #1867BD #2476C8 #3086D2 #3C95DD #48A5E8

#0048A8 - #48A5E8

HSV Blend

#0048A8 - #48A5E8 | 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 #0048A8 as 0% and #48A5E8 as 100%.

0.0%	0.0% #0048A8	RGB 0 72 168	#0048A8
16.7%	16.7% #0956B2	RGB 9 86 178	#0956B2
33.3%	33.3% #1364BD	RGB 19 100 189	#1364BD
50.0%	50.0% #1F74C8	RGB 31 116 200	#1F74C8
66.7%	66.7% #2B84D2	RGB 43 132 210	#2B84D2
83.3%	83.3% #3994DD	RGB 57 148 221	#3994DD
100.0%	100.0% #48A5E8	RGB 72 165 232	#48A5E8

#0048A8 #0956B2 #1364BD #1F74C8 #2B84D2 #3994DD #48A5E8

#0048A8 - #1F74C8 - #48A5E8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0048A8 0%, #1F74C8 50%, #48A5E8 100%);
    background: -webkit-linear-gradient(top, #0048A8 0%, #1F74C8 50%, #48A5E8 100%);
    background: linear-gradient(to bottom, #0048A8 0%, #1F74C8 50%, #48A5E8 100%);
}
</style>