#C2DAFA - #648FCE | 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 #C2DAFA to #648FCE

#C2DAFA #648FCE

Calculate the color between two colors, #C2DAFA and #648FCE. 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)

#C2DAFA - #648FCE | 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 #C2DAFA as 0% and #648FCE as 100%.

0.0%	0.0% #C2DAFA	RGB 194 218 250	#C2DAFA
16.7%	16.7% #B2CDF2	RGB 178 205 242	#B2CDF2
33.3%	33.3% #A2C1EB	RGB 162 193 235	#A2C1EB
50.0%	50.0% #93B4E4	RGB 147 180 228	#93B4E4
66.7%	66.7% #83A8DC	RGB 131 168 220	#83A8DC
83.3%	83.3% #739BD5	RGB 115 155 213	#739BD5
100.0%	100.0% #648FCE	RGB 100 143 206	#648FCE

#C2DAFA #B2CDF2 #A2C1EB #93B4E4 #83A8DC #739BD5 #648FCE

#C2DAFA - #648FCE

HSV Blend

#C2DAFA - #648FCE | 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 #C2DAFA as 0% and #648FCE as 100%.

0.0%	0.0% #C2DAFA	RGB 194 218 250	#C2DAFA
16.7%	16.7% #B0CCF2	RGB 176 204 242	#B0CCF2
33.3%	33.3% #9FBFEB	RGB 159 191 235	#9FBFEB
50.0%	50.0% #8FB2E4	RGB 143 178 228	#8FB2E4
66.7%	66.7% #80A6DC	RGB 128 166 220	#80A6DC
83.3%	83.3% #719AD5	RGB 113 154 213	#719AD5
100.0%	100.0% #648FCE	RGB 100 143 206	#648FCE

#C2DAFA #B0CCF2 #9FBFEB #8FB2E4 #80A6DC #719AD5 #648FCE

#C2DAFA - #8FB2E4 - #648FCE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C2DAFA 0%, #8FB2E4 50%, #648FCE 100%);
    background: -webkit-linear-gradient(top, #C2DAFA 0%, #8FB2E4 50%, #648FCE 100%);
    background: linear-gradient(to bottom, #C2DAFA 0%, #8FB2E4 50%, #648FCE 100%);
}
</style>