#5E82A2 - #7BB7FE | 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 #5E82A2 to #7BB7FE

#5E82A2 #7BB7FE

Calculate the color between two colors, #5E82A2 and #7BB7FE. 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)

#5E82A2 - #7BB7FE | 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 #5E82A2 as 0% and #7BB7FE as 100%.

0.0%	0.0% #5E82A2	RGB 94 130 162	#5E82A2
16.7%	16.7% #628AB1	RGB 98 138 177	#628AB1
33.3%	33.3% #6793C0	RGB 103 147 192	#6793C0
50.0%	50.0% #6C9CD0	RGB 108 156 208	#6C9CD0
66.7%	66.7% #71A5DF	RGB 113 165 223	#71A5DF
83.3%	83.3% #76AEEE	RGB 118 174 238	#76AEEE
100.0%	100.0% #7BB7FE	RGB 123 183 254	#7BB7FE

#5E82A2 #628AB1 #6793C0 #6C9CD0 #71A5DF #76AEEE #7BB7FE

#5E82A2 - #7BB7FE

HSV Blend

#5E82A2 - #7BB7FE | 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 #5E82A2 as 0% and #7BB7FE as 100%.

0.0%	0.0% #5E82A2	RGB 94 130 162	#5E82A2
16.7%	16.7% #648CB1	RGB 100 140 177	#648CB1
33.3%	33.3% #6995C0	RGB 105 149 192	#6995C0
50.0%	50.0% #6E9ED0	RGB 110 158 208	#6E9ED0
66.7%	66.7% #73A7DF	RGB 115 167 223	#73A7DF
83.3%	83.3% #77AFEE	RGB 119 175 238	#77AFEE
100.0%	100.0% #7BB7FE	RGB 123 183 254	#7BB7FE

#5E82A2 #648CB1 #6995C0 #6E9ED0 #73A7DF #77AFEE #7BB7FE

#5E82A2 - #6E9ED0 - #7BB7FE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E82A2 0%, #6E9ED0 50%, #7BB7FE 100%);
    background: -webkit-linear-gradient(top, #5E82A2 0%, #6E9ED0 50%, #7BB7FE 100%);
    background: linear-gradient(to bottom, #5E82A2 0%, #6E9ED0 50%, #7BB7FE 100%);
}
</style>