#C0D7E7 - #688CB2 | 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 #C0D7E7 to #688CB2

#C0D7E7 #688CB2

Calculate the color between two colors, #C0D7E7 and #688CB2. 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)

#C0D7E7 - #688CB2 | 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 #C0D7E7 as 0% and #688CB2 as 100%.

0.0%	0.0% #C0D7E7	RGB 192 215 231	#C0D7E7
16.7%	16.7% #B1CADE	RGB 177 202 222	#B1CADE
33.3%	33.3% #A2BED5	RGB 162 190 213	#A2BED5
50.0%	50.0% #94B1CC	RGB 148 177 204	#94B1CC
66.7%	66.7% #85A5C3	RGB 133 165 195	#85A5C3
83.3%	83.3% #7698BA	RGB 118 152 186	#7698BA
100.0%	100.0% #688CB2	RGB 104 140 178	#688CB2

#C0D7E7 #B1CADE #A2BED5 #94B1CC #85A5C3 #7698BA #688CB2

#C0D7E7 - #688CB2

HSV Blend

#C0D7E7 - #688CB2 | 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 #C0D7E7 as 0% and #688CB2 as 100%.

0.0%	0.0% #C0D7E7	RGB 192 215 231	#C0D7E7
16.7%	16.7% #AFCADE	RGB 175 202 222	#AFCADE
33.3%	33.3% #9FBDD5	RGB 159 189 213	#9FBDD5
50.0%	50.0% #90B0CC	RGB 144 176 204	#90B0CC
66.7%	66.7% #82A4C3	RGB 130 164 195	#82A4C3
83.3%	83.3% #7498BA	RGB 116 152 186	#7498BA
100.0%	100.0% #688CB2	RGB 104 140 178	#688CB2

#C0D7E7 #AFCADE #9FBDD5 #90B0CC #82A4C3 #7498BA #688CB2

#C0D7E7 - #90B0CC - #688CB2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C0D7E7 0%, #90B0CC 50%, #688CB2 100%);
    background: -webkit-linear-gradient(top, #C0D7E7 0%, #90B0CC 50%, #688CB2 100%);
    background: linear-gradient(to bottom, #C0D7E7 0%, #90B0CC 50%, #688CB2 100%);
}
</style>