#4D7ADE - #CCD9F5 | 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 #4D7ADE to #CCD9F5

#4D7ADE #CCD9F5

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

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

0.0%	0.0% #4D7ADE	RGB 77 122 222	#4D7ADE
16.7%	16.7% #6289E1	RGB 98 137 225	#6289E1
33.3%	33.3% #7799E5	RGB 119 153 229	#7799E5
50.0%	50.0% #8CA9E9	RGB 140 169 233	#8CA9E9
66.7%	66.7% #A1B9ED	RGB 161 185 237	#A1B9ED
83.3%	83.3% #B6C9F1	RGB 182 201 241	#B6C9F1
100.0%	100.0% #CCD9F5	RGB 204 217 245	#CCD9F5

#4D7ADE #6289E1 #7799E5 #8CA9E9 #A1B9ED #B6C9F1 #CCD9F5

#4D7ADE - #CCD9F5

HSV Blend

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

0.0%	0.0% #4D79DE	RGB 77 121 222	#4D79DE
16.7%	16.7% #6088E1	RGB 96 136 225	#6088E1
33.3%	33.3% #7498E5	RGB 116 152 229	#7498E5
50.0%	50.0% #89A7E9	RGB 137 167 233	#89A7E9
66.7%	66.7% #9FB7ED	RGB 159 183 237	#9FB7ED
83.3%	83.3% #B5C8F1	RGB 181 200 241	#B5C8F1
100.0%	100.0% #CCD9F5	RGB 204 217 245	#CCD9F5

#4D79DE #6088E1 #7498E5 #89A7E9 #9FB7ED #B5C8F1 #CCD9F5

#4D7ADE - #89A7E9 - #CCD9F5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4D79DE 0%, #89A7E9 50%, #CCD9F5 100%);
    background: -webkit-linear-gradient(top, #4D79DE 0%, #89A7E9 50%, #CCD9F5 100%);
    background: linear-gradient(to bottom, #4D79DE 0%, #89A7E9 50%, #CCD9F5 100%);
}
</style>