#2B5EAC - #81AED5 | 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 #2B5EAC to #81AED5

#2B5EAC #81AED5

Calculate the color between two colors, #2B5EAC and #81AED5. 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)

#2B5EAC - #81AED5 | 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 #2B5EAC as 0% and #81AED5 as 100%.

0.0%	0.0% #2B5EAC	RGB 43 94 172	#2B5EAC
16.7%	16.7% #396BB2	RGB 57 107 178	#396BB2
33.3%	33.3% #4778B9	RGB 71 120 185	#4778B9
50.0%	50.0% #5686C0	RGB 86 134 192	#5686C0
66.7%	66.7% #6493C7	RGB 100 147 199	#6493C7
83.3%	83.3% #72A0CE	RGB 114 160 206	#72A0CE
100.0%	100.0% #81AED5	RGB 129 174 213	#81AED5

#2B5EAC #396BB2 #4778B9 #5686C0 #6493C7 #72A0CE #81AED5

#2B5EAC - #81AED5

HSV Blend

#2B5EAC - #81AED5 | 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 #2B5EAC as 0% and #81AED5 as 100%.

0.0%	0.0% #2B5EAC	RGB 43 94 172	#2B5EAC
16.7%	16.7% #376BB2	RGB 55 107 178	#376BB2
33.3%	33.3% #4478B9	RGB 68 120 185	#4478B9
50.0%	50.0% #5285C0	RGB 82 133 192	#5285C0
66.7%	66.7% #6193C7	RGB 97 147 199	#6193C7
83.3%	83.3% #70A0CE	RGB 112 160 206	#70A0CE
100.0%	100.0% #81AED5	RGB 129 174 213	#81AED5

#2B5EAC #376BB2 #4478B9 #5285C0 #6193C7 #70A0CE #81AED5

#2B5EAC - #5285C0 - #81AED5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2B5EAC 0%, #5285C0 50%, #81AED5 100%);
    background: -webkit-linear-gradient(top, #2B5EAC 0%, #5285C0 50%, #81AED5 100%);
    background: linear-gradient(to bottom, #2B5EAC 0%, #5285C0 50%, #81AED5 100%);
}
</style>