#6AB3C0 - #2B657C | 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 #6AB3C0 to #2B657C

#6AB3C0 #2B657C

Calculate the color between two colors, #6AB3C0 and #2B657C. 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)

#6AB3C0 - #2B657C | 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 #6AB3C0 as 0% and #2B657C as 100%.

0.0%	0.0% #6AB3C0	RGB 106 179 192	#6AB3C0
16.7%	16.7% #5FA6B4	RGB 95 166 180	#5FA6B4
33.3%	33.3% #5599A9	RGB 85 153 169	#5599A9
50.0%	50.0% #4A8C9E	RGB 74 140 158	#4A8C9E
66.7%	66.7% #407F92	RGB 64 127 146	#407F92
83.3%	83.3% #357287	RGB 53 114 135	#357287
100.0%	100.0% #2B657C	RGB 43 101 124	#2B657C

#6AB3C0 #5FA6B4 #5599A9 #4A8C9E #407F92 #357287 #2B657C

#6AB3C0 - #2B657C

HSV Blend

#6AB3C0 - #2B657C | 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 #6AB3C0 as 0% and #2B657C as 100%.

0.0%	0.0% #6AB3C0	RGB 106 179 192	#6AB3C0
16.7%	16.7% #5DA5B4	RGB 93 165 180	#5DA5B4
33.3%	33.3% #5198A9	RGB 81 152 169	#5198A9
50.0%	50.0% #478B9E	RGB 71 139 158	#478B9E
66.7%	66.7% #3C7E92	RGB 60 126 146	#3C7E92
83.3%	83.3% #337187	RGB 51 113 135	#337187
100.0%	100.0% #2B657C	RGB 43 101 124	#2B657C

#6AB3C0 #5DA5B4 #5198A9 #478B9E #3C7E92 #337187 #2B657C

#6AB3C0 - #478B9E - #2B657C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6AB3C0 0%, #478B9E 50%, #2B657C 100%);
    background: -webkit-linear-gradient(top, #6AB3C0 0%, #478B9E 50%, #2B657C 100%);
    background: linear-gradient(to bottom, #6AB3C0 0%, #478B9E 50%, #2B657C 100%);
}
</style>