#5E9AC1 - #C8D2CF | 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 #5E9AC1 to #C8D2CF

#5E9AC1 #C8D2CF

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

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

0.0%	0.0% #5E9AC1	RGB 94 154 193	#5E9AC1
16.7%	16.7% #6FA3C3	RGB 111 163 195	#6FA3C3
33.3%	33.3% #81ACC5	RGB 129 172 197	#81ACC5
50.0%	50.0% #93B6C8	RGB 147 182 200	#93B6C8
66.7%	66.7% #A4BFCA	RGB 164 191 202	#A4BFCA
83.3%	83.3% #B6C8CC	RGB 182 200 204	#B6C8CC
100.0%	100.0% #C8D2CF	RGB 200 210 207	#C8D2CF

#5E9AC1 #6FA3C3 #81ACC5 #93B6C8 #A4BFCA #B6C8CC #C8D2CF

#5E9AC1 - #C8D2CF

HSV Blend

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

0.0%	0.0% #5E99C1	RGB 94 153 193	#5E99C1
16.7%	16.7% #6EACC3	RGB 110 172 195	#6EACC3
33.3%	33.3% #7FBBC6	RGB 127 187 198	#7FBBC6
50.0%	50.0% #91C6C9	RGB 145 198 201	#91C6C9
66.7%	66.7% #A2CCC9	RGB 162 204 201	#A2CCC9
83.3%	83.3% #B5CFCA	RGB 181 207 202	#B5CFCA
100.0%	100.0% #C8D2CF	RGB 200 210 207	#C8D2CF

#5E99C1 #6EACC3 #7FBBC6 #91C6C9 #A2CCC9 #B5CFCA #C8D2CF

#5E9AC1 - #91C6C9 - #C8D2CF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E99C1 0%, #91C6C9 50%, #C8D2CF 100%);
    background: -webkit-linear-gradient(top, #5E99C1 0%, #91C6C9 50%, #C8D2CF 100%);
    background: linear-gradient(to bottom, #5E99C1 0%, #91C6C9 50%, #C8D2CF 100%);
}
</style>