#6DA5E9 - #2153AE | 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 #6DA5E9 to #2153AE

#6DA5E9 #2153AE

Calculate the color between two colors, #6DA5E9 and #2153AE. 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)

#6DA5E9 - #2153AE | 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 #6DA5E9 as 0% and #2153AE as 100%.

0.0%	0.0% #6DA5E9	RGB 109 165 233	#6DA5E9
16.7%	16.7% #6097DF	RGB 96 151 223	#6097DF
33.3%	33.3% #5389D5	RGB 83 137 213	#5389D5
50.0%	50.0% #477CCB	RGB 71 124 203	#477CCB
66.7%	66.7% #3A6EC1	RGB 58 110 193	#3A6EC1
83.3%	83.3% #2D60B7	RGB 45 96 183	#2D60B7
100.0%	100.0% #2153AE	RGB 33 83 174	#2153AE

#6DA5E9 #6097DF #5389D5 #477CCB #3A6EC1 #2D60B7 #2153AE

#6DA5E9 - #2153AE

HSV Blend

#6DA5E9 - #2153AE | 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 #6DA5E9 as 0% and #2153AE as 100%.

0.0%	0.0% #6DA4E9	RGB 109 164 233	#6DA4E9
16.7%	16.7% #5E96DF	RGB 94 150 223	#5E96DF
33.3%	33.3% #5087D5	RGB 80 135 213	#5087D5
50.0%	50.0% #4279CB	RGB 66 121 203	#4279CB
66.7%	66.7% #366CC1	RGB 54 108 193	#366CC1
83.3%	83.3% #2B5FB7	RGB 43 95 183	#2B5FB7
100.0%	100.0% #2153AE	RGB 33 83 174	#2153AE

#6DA4E9 #5E96DF #5087D5 #4279CB #366CC1 #2B5FB7 #2153AE

#6DA5E9 - #4279CB - #2153AE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6DA4E9 0%, #4279CB 50%, #2153AE 100%);
    background: -webkit-linear-gradient(top, #6DA4E9 0%, #4279CB 50%, #2153AE 100%);
    background: linear-gradient(to bottom, #6DA4E9 0%, #4279CB 50%, #2153AE 100%);
}
</style>