#003AB5 - #72ACE3 | 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 #003AB5 to #72ACE3

#003AB5 #72ACE3

Calculate the color between two colors, #003AB5 and #72ACE3. 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)

#003AB5 - #72ACE3 | 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 #003AB5 as 0% and #72ACE3 as 100%.

0.0%	0.0% #003AB5	RGB 0 58 181	#003AB5
16.7%	16.7% #134DBC	RGB 19 77 188	#134DBC
33.3%	33.3% #2660C4	RGB 38 96 196	#2660C4
50.0%	50.0% #3973CC	RGB 57 115 204	#3973CC
66.7%	66.7% #4C86D3	RGB 76 134 211	#4C86D3
83.3%	83.3% #5F99DB	RGB 95 153 219	#5F99DB
100.0%	100.0% #72ACE3	RGB 114 172 227	#72ACE3

#003AB5 #134DBC #2660C4 #3973CC #4C86D3 #5F99DB #72ACE3

#003AB5 - #72ACE3

HSV Blend

#003AB5 - #72ACE3 | 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 #003AB5 as 0% and #72ACE3 as 100%.

0.0%	0.0% #0039B5	RGB 0 57 181	#0039B5
16.7%	16.7% #0F4CBC	RGB 15 76 188	#0F4CBC
33.3%	33.3% #205FC4	RGB 32 95 196	#205FC4
50.0%	50.0% #3372CC	RGB 51 114 204	#3372CC
66.7%	66.7% #4686D3	RGB 70 134 211	#4686D3
83.3%	83.3% #5B99DB	RGB 91 153 219	#5B99DB
100.0%	100.0% #72ACE3	RGB 114 172 227	#72ACE3

#0039B5 #0F4CBC #205FC4 #3372CC #4686D3 #5B99DB #72ACE3

#003AB5 - #3372CC - #72ACE3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0039B5 0%, #3372CC 50%, #72ACE3 100%);
    background: -webkit-linear-gradient(top, #0039B5 0%, #3372CC 50%, #72ACE3 100%);
    background: linear-gradient(to bottom, #0039B5 0%, #3372CC 50%, #72ACE3 100%);
}
</style>