#418FBA - #C8DFEB | 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 #418FBA to #C8DFEB

#418FBA #C8DFEB

Calculate the color between two colors, #418FBA and #C8DFEB. 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)

#418FBA - #C8DFEB | 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 #418FBA as 0% and #C8DFEB as 100%.

0.0%	0.0% #418FBA	RGB 65 143 186	#418FBA
16.7%	16.7% #579CC2	RGB 87 156 194	#579CC2
33.3%	33.3% #6EA9CA	RGB 110 169 202	#6EA9CA
50.0%	50.0% #84B7D2	RGB 132 183 210	#84B7D2
66.7%	66.7% #9BC4DA	RGB 155 196 218	#9BC4DA
83.3%	83.3% #B1D1E2	RGB 177 209 226	#B1D1E2
100.0%	100.0% #C8DFEB	RGB 200 223 235	#C8DFEB

#418FBA #579CC2 #6EA9CA #84B7D2 #9BC4DA #B1D1E2 #C8DFEB

#418FBA - #C8DFEB

HSV Blend

#418FBA - #C8DFEB | 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 #418FBA as 0% and #C8DFEB as 100%.

0.0%	0.0% #418EBA	RGB 65 142 186	#418EBA
16.7%	16.7% #549BC2	RGB 84 155 194	#549BC2
33.3%	33.3% #68A7CA	RGB 104 167 202	#68A7CA
50.0%	50.0% #7EB5D2	RGB 126 181 210	#7EB5D2
66.7%	66.7% #95C2DA	RGB 149 194 218	#95C2DA
83.3%	83.3% #AED0E2	RGB 174 208 226	#AED0E2
100.0%	100.0% #C8DFEB	RGB 200 223 235	#C8DFEB

#418EBA #549BC2 #68A7CA #7EB5D2 #95C2DA #AED0E2 #C8DFEB

#418FBA - #7EB5D2 - #C8DFEB

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #418EBA 0%, #7EB5D2 50%, #C8DFEB 100%);
    background: -webkit-linear-gradient(top, #418EBA 0%, #7EB5D2 50%, #C8DFEB 100%);
    background: linear-gradient(to bottom, #418EBA 0%, #7EB5D2 50%, #C8DFEB 100%);
}
</style>