#6EB6E7 - #2266B0 | 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 #6EB6E7 to #2266B0

#6EB6E7 #2266B0

Calculate the color between two colors, #6EB6E7 and #2266B0. 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)

#6EB6E7 - #2266B0 | 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 #6EB6E7 as 0% and #2266B0 as 100%.

0.0%	0.0% #6EB6E7	RGB 110 182 231	#6EB6E7
16.7%	16.7% #61A8DD	RGB 97 168 221	#61A8DD
33.3%	33.3% #549BD4	RGB 84 155 212	#549BD4
50.0%	50.0% #488ECB	RGB 72 142 203	#488ECB
66.7%	66.7% #3B80C2	RGB 59 128 194	#3B80C2
83.3%	83.3% #2E73B9	RGB 46 115 185	#2E73B9
100.0%	100.0% #2266B0	RGB 34 102 176	#2266B0

#6EB6E7 #61A8DD #549BD4 #488ECB #3B80C2 #2E73B9 #2266B0

#6EB6E7 - #2266B0

HSV Blend

#6EB6E7 - #2266B0 | 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 #6EB6E7 as 0% and #2266B0 as 100%.

0.0%	0.0% #6EB5E7	RGB 110 181 231	#6EB5E7
16.7%	16.7% #5FA8DD	RGB 95 168 221	#5FA8DD
33.3%	33.3% #519AD4	RGB 81 154 212	#519AD4
50.0%	50.0% #448CCB	RGB 68 140 203	#448CCB
66.7%	66.7% #377FC2	RGB 55 127 194	#377FC2
83.3%	83.3% #2C72B9	RGB 44 114 185	#2C72B9
100.0%	100.0% #2266B0	RGB 34 102 176	#2266B0

#6EB5E7 #5FA8DD #519AD4 #448CCB #377FC2 #2C72B9 #2266B0

#6EB6E7 - #448CCB - #2266B0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6EB5E7 0%, #448CCB 50%, #2266B0 100%);
    background: -webkit-linear-gradient(top, #6EB5E7 0%, #448CCB 50%, #2266B0 100%);
    background: linear-gradient(to bottom, #6EB5E7 0%, #448CCB 50%, #2266B0 100%);
}
</style>