#C7DFE6 - #5BA0BA | 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 #C7DFE6 to #5BA0BA

#C7DFE6 #5BA0BA

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

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

0.0%	0.0% #C7DFE6	RGB 199 223 230	#C7DFE6
16.7%	16.7% #B5D4DE	RGB 181 212 222	#B5D4DE
33.3%	33.3% #A3CAD7	RGB 163 202 215	#A3CAD7
50.0%	50.0% #91BFD0	RGB 145 191 208	#91BFD0
66.7%	66.7% #7FB5C8	RGB 127 181 200	#7FB5C8
83.3%	83.3% #6DAAC1	RGB 109 170 193	#6DAAC1
100.0%	100.0% #5BA0BA	RGB 91 160 186	#5BA0BA

#C7DFE6 #B5D4DE #A3CAD7 #91BFD0 #7FB5C8 #6DAAC1 #5BA0BA

#C7DFE6 - #5BA0BA

HSV Blend

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

0.0%	0.0% #C7DFE6	RGB 199 223 230	#C7DFE6
16.7%	16.7% #B2D4DE	RGB 178 212 222	#B2D4DE
33.3%	33.3% #9FC9D7	RGB 159 201 215	#9FC9D7
50.0%	50.0% #8CBFD0	RGB 140 191 208	#8CBFD0
66.7%	66.7% #7BB4C8	RGB 123 180 200	#7BB4C8
83.3%	83.3% #6AAAC1	RGB 106 170 193	#6AAAC1
100.0%	100.0% #5BA0BA	RGB 91 160 186	#5BA0BA

#C7DFE6 #B2D4DE #9FC9D7 #8CBFD0 #7BB4C8 #6AAAC1 #5BA0BA

#C7DFE6 - #8CBFD0 - #5BA0BA

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C7DFE6 0%, #8CBFD0 50%, #5BA0BA 100%);
    background: -webkit-linear-gradient(top, #C7DFE6 0%, #8CBFD0 50%, #5BA0BA 100%);
    background: linear-gradient(to bottom, #C7DFE6 0%, #8CBFD0 50%, #5BA0BA 100%);
}
</style>