#C8DDEC - #5E8DC2 | 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 #C8DDEC to #5E8DC2

#C8DDEC #5E8DC2

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

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

0.0%	0.0% #C8DDEC	RGB 200 221 236	#C8DDEC
16.7%	16.7% #B6CFE5	RGB 182 207 229	#B6CFE5
33.3%	33.3% #A4C2DE	RGB 164 194 222	#A4C2DE
50.0%	50.0% #93B5D7	RGB 147 181 215	#93B5D7
66.7%	66.7% #81A7D0	RGB 129 167 208	#81A7D0
83.3%	83.3% #6F9AC9	RGB 111 154 201	#6F9AC9
100.0%	100.0% #5E8DC2	RGB 94 141 194	#5E8DC2

#C8DDEC #B6CFE5 #A4C2DE #93B5D7 #81A7D0 #6F9AC9 #5E8DC2

#C8DDEC - #5E8DC2

HSV Blend

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

0.0%	0.0% #C8DDEC	RGB 200 221 236	#C8DDEC
16.7%	16.7% #B4CFE5	RGB 180 207 229	#B4CFE5
33.3%	33.3% #A1C2DE	RGB 161 194 222	#A1C2DE
50.0%	50.0% #8FB5D7	RGB 143 181 215	#8FB5D7
66.7%	66.7% #7DA7D0	RGB 125 167 208	#7DA7D0
83.3%	83.3% #6D9AC9	RGB 109 154 201	#6D9AC9
100.0%	100.0% #5E8DC2	RGB 94 141 194	#5E8DC2

#C8DDEC #B4CFE5 #A1C2DE #8FB5D7 #7DA7D0 #6D9AC9 #5E8DC2

#C8DDEC - #8FB5D7 - #5E8DC2

CSS codes

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

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