#C0DCFF - #5576CF | 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 #C0DCFF to #5576CF

#C0DCFF #5576CF

Calculate the color between two colors, #C0DCFF and #5576CF. 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)

#C0DCFF - #5576CF | 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 #C0DCFF as 0% and #5576CF as 100%.

0.0%	0.0% #C0DCFF	RGB 192 220 255	#C0DCFF
16.7%	16.7% #AECBF7	RGB 174 203 247	#AECBF7
33.3%	33.3% #9CBAEF	RGB 156 186 239	#9CBAEF
50.0%	50.0% #8AA9E7	RGB 138 169 231	#8AA9E7
66.7%	66.7% #7898DF	RGB 120 152 223	#7898DF
83.3%	83.3% #6687D7	RGB 102 135 215	#6687D7
100.0%	100.0% #5576CF	RGB 85 118 207	#5576CF

#C0DCFF #AECBF7 #9CBAEF #8AA9E7 #7898DF #6687D7 #5576CF

#C0DCFF - #5576CF

HSV Blend

#C0DCFF - #5576CF | 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 #C0DCFF as 0% and #5576CF as 100%.

0.0%	0.0% #C0DCFF	RGB 192 220 255	#C0DCFF
16.7%	16.7% #ABCBF7	RGB 171 203 247	#ABCBF7
33.3%	33.3% #98BAEF	RGB 152 186 239	#98BAEF
50.0%	50.0% #86A8E7	RGB 134 168 231	#86A8E7
66.7%	66.7% #7597DF	RGB 117 151 223	#7597DF
83.3%	83.3% #6486D7	RGB 100 134 215	#6486D7
100.0%	100.0% #5576CF	RGB 85 118 207	#5576CF

#C0DCFF #ABCBF7 #98BAEF #86A8E7 #7597DF #6486D7 #5576CF

#C0DCFF - #86A8E7 - #5576CF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C0DCFF 0%, #86A8E7 50%, #5576CF 100%);
    background: -webkit-linear-gradient(top, #C0DCFF 0%, #86A8E7 50%, #5576CF 100%);
    background: linear-gradient(to bottom, #C0DCFF 0%, #86A8E7 50%, #5576CF 100%);
}
</style>