#5A8FC7 - #CFDFEF | 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 #5A8FC7 to #CFDFEF

#5A8FC7 #CFDFEF

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

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

0.0%	0.0% #5A8FC7	RGB 90 143 199	#5A8FC7
16.7%	16.7% #6D9CCD	RGB 109 156 205	#6D9CCD
33.3%	33.3% #81A9D4	RGB 129 169 212	#81A9D4
50.0%	50.0% #94B7DB	RGB 148 183 219	#94B7DB
66.7%	66.7% #A8C4E1	RGB 168 196 225	#A8C4E1
83.3%	83.3% #BBD1E8	RGB 187 209 232	#BBD1E8
100.0%	100.0% #CFDFEF	RGB 207 223 239	#CFDFEF

#5A8FC7 #6D9CCD #81A9D4 #94B7DB #A8C4E1 #BBD1E8 #CFDFEF

#5A8FC7 - #CFDFEF

HSV Blend

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

0.0%	0.0% #5A8FC7	RGB 90 143 199	#5A8FC7
16.7%	16.7% #6B9BCD	RGB 107 155 205	#6B9BCD
33.3%	33.3% #7DA8D4	RGB 125 168 212	#7DA8D4
50.0%	50.0% #90B5DB	RGB 144 181 219	#90B5DB
66.7%	66.7% #A4C2E1	RGB 164 194 225	#A4C2E1
83.3%	83.3% #B9D0E8	RGB 185 208 232	#B9D0E8
100.0%	100.0% #CFDFEF	RGB 207 223 239	#CFDFEF

#5A8FC7 #6B9BCD #7DA8D4 #90B5DB #A4C2E1 #B9D0E8 #CFDFEF

#5A8FC7 - #90B5DB - #CFDFEF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5A8FC7 0%, #90B5DB 50%, #CFDFEF 100%);
    background: -webkit-linear-gradient(top, #5A8FC7 0%, #90B5DB 50%, #CFDFEF 100%);
    background: linear-gradient(to bottom, #5A8FC7 0%, #90B5DB 50%, #CFDFEF 100%);
}
</style>