#4180BA - #C8DAEB | 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 #4180BA to #C8DAEB

#4180BA #C8DAEB

Calculate the color between two colors, #4180BA and #C8DAEB. 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)

#4180BA - #C8DAEB | 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 #4180BA as 0% and #C8DAEB as 100%.

0.0%	0.0% #4180BA	RGB 65 128 186	#4180BA
16.7%	16.7% #578FC2	RGB 87 143 194	#578FC2
33.3%	33.3% #6E9ECA	RGB 110 158 202	#6E9ECA
50.0%	50.0% #84ADD2	RGB 132 173 210	#84ADD2
66.7%	66.7% #9BBCDA	RGB 155 188 218	#9BBCDA
83.3%	83.3% #B1CBE2	RGB 177 203 226	#B1CBE2
100.0%	100.0% #C8DAEB	RGB 200 218 235	#C8DAEB

#4180BA #578FC2 #6E9ECA #84ADD2 #9BBCDA #B1CBE2 #C8DAEB

#4180BA - #C8DAEB

HSV Blend

#4180BA - #C8DAEB | 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 #4180BA as 0% and #C8DAEB as 100%.

0.0%	0.0% #4180BA	RGB 65 128 186	#4180BA
16.7%	16.7% #548DC2	RGB 84 141 194	#548DC2
33.3%	33.3% #689BCA	RGB 104 155 202	#689BCA
50.0%	50.0% #7EA9D2	RGB 126 169 210	#7EA9D2
66.7%	66.7% #95B9DA	RGB 149 185 218	#95B9DA
83.3%	83.3% #AEC9E2	RGB 174 201 226	#AEC9E2
100.0%	100.0% #C8DAEB	RGB 200 218 235	#C8DAEB

#4180BA #548DC2 #689BCA #7EA9D2 #95B9DA #AEC9E2 #C8DAEB

#4180BA - #7EA9D2 - #C8DAEB

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4180BA 0%, #7EA9D2 50%, #C8DAEB 100%);
    background: -webkit-linear-gradient(top, #4180BA 0%, #7EA9D2 50%, #C8DAEB 100%);
    background: linear-gradient(to bottom, #4180BA 0%, #7EA9D2 50%, #C8DAEB 100%);
}
</style>