#4D82AA - #CCDAE6 | 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 #4D82AA to #CCDAE6

#4D82AA #CCDAE6

Calculate the color between two colors, #4D82AA and #CCDAE6. 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)

#4D82AA - #CCDAE6 | 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 #4D82AA as 0% and #CCDAE6 as 100%.

0.0%	0.0% #4D82AA	RGB 77 130 170	#4D82AA
16.7%	16.7% #6290B4	RGB 98 144 180	#6290B4
33.3%	33.3% #779FBE	RGB 119 159 190	#779FBE
50.0%	50.0% #8CAEC8	RGB 140 174 200	#8CAEC8
66.7%	66.7% #A1BCD2	RGB 161 188 210	#A1BCD2
83.3%	83.3% #B6CBDC	RGB 182 203 220	#B6CBDC
100.0%	100.0% #CCDAE6	RGB 204 218 230	#CCDAE6

#4D82AA #6290B4 #779FBE #8CAEC8 #A1BCD2 #B6CBDC #CCDAE6

#4D82AA - #CCDAE6

HSV Blend

#4D82AA - #CCDAE6 | 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 #4D82AA as 0% and #CCDAE6 as 100%.

0.0%	0.0% #4D81AA	RGB 77 129 170	#4D81AA
16.7%	16.7% #5E8EB4	RGB 94 142 180	#5E8EB4
33.3%	33.3% #719CBE	RGB 113 156 190	#719CBE
50.0%	50.0% #85AAC8	RGB 133 170 200	#85AAC8
66.7%	66.7% #9BB9D2	RGB 155 185 210	#9BB9D2
83.3%	83.3% #B3C9DC	RGB 179 201 220	#B3C9DC
100.0%	100.0% #CCDAE6	RGB 204 218 230	#CCDAE6

#4D81AA #5E8EB4 #719CBE #85AAC8 #9BB9D2 #B3C9DC #CCDAE6

#4D82AA - #85AAC8 - #CCDAE6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4D81AA 0%, #85AAC8 50%, #CCDAE6 100%);
    background: -webkit-linear-gradient(top, #4D81AA 0%, #85AAC8 50%, #CCDAE6 100%);
    background: linear-gradient(to bottom, #4D81AA 0%, #85AAC8 50%, #CCDAE6 100%);
}
</style>