#1F55A8 - #71A8D8 | 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 #1F55A8 to #71A8D8

#1F55A8 #71A8D8

Calculate the color between two colors, #1F55A8 and #71A8D8. 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)

#1F55A8 - #71A8D8 | 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 #1F55A8 as 0% and #71A8D8 as 100%.

0.0%	0.0% #1F55A8	RGB 31 85 168	#1F55A8
16.7%	16.7% #2C62B0	RGB 44 98 176	#2C62B0
33.3%	33.3% #3A70B8	RGB 58 112 184	#3A70B8
50.0%	50.0% #487EC0	RGB 72 126 192	#487EC0
66.7%	66.7% #558CC8	RGB 85 140 200	#558CC8
83.3%	83.3% #639AD0	RGB 99 154 208	#639AD0
100.0%	100.0% #71A8D8	RGB 113 168 216	#71A8D8

#1F55A8 #2C62B0 #3A70B8 #487EC0 #558CC8 #639AD0 #71A8D8

#1F55A8 - #71A8D8

HSV Blend

#1F55A8 - #71A8D8 | 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 #1F55A8 as 0% and #71A8D8 as 100%.

0.0%	0.0% #1F54A8	RGB 31 84 168	#1F54A8
16.7%	16.7% #2A62B0	RGB 42 98 176	#2A62B0
33.3%	33.3% #366FB8	RGB 54 111 184	#366FB8
50.0%	50.0% #437DC0	RGB 67 125 192	#437DC0
66.7%	66.7% #528BC8	RGB 82 139 200	#528BC8
83.3%	83.3% #6199D0	RGB 97 153 208	#6199D0
100.0%	100.0% #71A8D8	RGB 113 168 216	#71A8D8

#1F54A8 #2A62B0 #366FB8 #437DC0 #528BC8 #6199D0 #71A8D8

#1F55A8 - #437DC0 - #71A8D8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #1F54A8 0%, #437DC0 50%, #71A8D8 100%);
    background: -webkit-linear-gradient(top, #1F54A8 0%, #437DC0 50%, #71A8D8 100%);
    background: linear-gradient(to bottom, #1F54A8 0%, #437DC0 50%, #71A8D8 100%);
}
</style>