#C0CCD2 - #54879F | 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 #C0CCD2 to #54879F

#C0CCD2 #54879F

Calculate the color between two colors, #C0CCD2 and #54879F. 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)

#C0CCD2 - #54879F | 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 #C0CCD2 as 0% and #54879F as 100%.

0.0%	0.0% #C0CCD2	RGB 192 204 210	#C0CCD2
16.7%	16.7% #AEC0C9	RGB 174 192 201	#AEC0C9
33.3%	33.3% #9CB5C1	RGB 156 181 193	#9CB5C1
50.0%	50.0% #8AA9B8	RGB 138 169 184	#8AA9B8
66.7%	66.7% #789EB0	RGB 120 158 176	#789EB0
83.3%	83.3% #6692A7	RGB 102 146 167	#6692A7
100.0%	100.0% #54879F	RGB 84 135 159	#54879F

#C0CCD2 #AEC0C9 #9CB5C1 #8AA9B8 #789EB0 #6692A7 #54879F

#C0CCD2 - #54879F

HSV Blend

#C0CCD2 - #54879F | 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 #C0CCD2 as 0% and #54879F as 100%.

0.0%	0.0% #C0CCD2	RGB 192 204 210	#C0CCD2
16.7%	16.7% #ABBFC9	RGB 171 191 201	#ABBFC9
33.3%	33.3% #97B3C1	RGB 151 179 193	#97B3C1
50.0%	50.0% #85A7B8	RGB 133 167 184	#85A7B8
66.7%	66.7% #739CB0	RGB 115 156 176	#739CB0
83.3%	83.3% #6391A7	RGB 99 145 167	#6391A7
100.0%	100.0% #54879F	RGB 84 135 159	#54879F

#C0CCD2 #ABBFC9 #97B3C1 #85A7B8 #739CB0 #6391A7 #54879F

#C0CCD2 - #85A7B8 - #54879F

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C0CCD2 0%, #85A7B8 50%, #54879F 100%);
    background: -webkit-linear-gradient(top, #C0CCD2 0%, #85A7B8 50%, #54879F 100%);
    background: linear-gradient(to bottom, #C0CCD2 0%, #85A7B8 50%, #54879F 100%);
}
</style>