#C4D1ED - #6684BA | 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 #C4D1ED to #6684BA

#C4D1ED #6684BA

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

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

0.0%	0.0% #C4D1ED	RGB 196 209 237	#C4D1ED
16.7%	16.7% #B4C4E4	RGB 180 196 228	#B4C4E4
33.3%	33.3% #A4B7DC	RGB 164 183 220	#A4B7DC
50.0%	50.0% #95AAD3	RGB 149 170 211	#95AAD3
66.7%	66.7% #859DCB	RGB 133 157 203	#859DCB
83.3%	83.3% #7590C2	RGB 117 144 194	#7590C2
100.0%	100.0% #6684BA	RGB 102 132 186	#6684BA

#C4D1ED #B4C4E4 #A4B7DC #95AAD3 #859DCB #7590C2 #6684BA

#C4D1ED - #6684BA

HSV Blend

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

0.0%	0.0% #C4D1ED	RGB 196 209 237	#C4D1ED
16.7%	16.7% #B2C2E4	RGB 178 194 228	#B2C2E4
33.3%	33.3% #A1B4DC	RGB 161 180 220	#A1B4DC
50.0%	50.0% #91A7D3	RGB 145 167 211	#91A7D3
66.7%	66.7% #829BCB	RGB 130 155 203	#829BCB
83.3%	83.3% #738FC2	RGB 115 143 194	#738FC2
100.0%	100.0% #6684BA	RGB 102 132 186	#6684BA

#C4D1ED #B2C2E4 #A1B4DC #91A7D3 #829BCB #738FC2 #6684BA

#C4D1ED - #91A7D3 - #6684BA

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C4D1ED 0%, #91A7D3 50%, #6684BA 100%);
    background: -webkit-linear-gradient(top, #C4D1ED 0%, #91A7D3 50%, #6684BA 100%);
    background: linear-gradient(to bottom, #C4D1ED 0%, #91A7D3 50%, #6684BA 100%);
}
</style>