#4D647B - #CCD2D9 | 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 #4D647B to #CCD2D9

#4D647B #CCD2D9

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

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

0.0%	0.0% #4D647B	RGB 77 100 123	#4D647B
16.7%	16.7% #62768A	RGB 98 118 138	#62768A
33.3%	33.3% #77889A	RGB 119 136 154	#77889A
50.0%	50.0% #8C9BAA	RGB 140 155 170	#8C9BAA
66.7%	66.7% #A1ADB9	RGB 161 173 185	#A1ADB9
83.3%	83.3% #B6BFC9	RGB 182 191 201	#B6BFC9
100.0%	100.0% #CCD2D9	RGB 204 210 217	#CCD2D9

#4D647B #62768A #77889A #8C9BAA #A1ADB9 #B6BFC9 #CCD2D9

#4D647B - #CCD2D9

HSV Blend

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

0.0%	0.0% #4D647B	RGB 77 100 123	#4D647B
16.7%	16.7% #5E748A	RGB 94 116 138	#5E748A
33.3%	33.3% #70859A	RGB 112 133 154	#70859A
50.0%	50.0% #8596AA	RGB 133 150 170	#8596AA
66.7%	66.7% #9BA9B9	RGB 155 169 185	#9BA9B9
83.3%	83.3% #B2BDC9	RGB 178 189 201	#B2BDC9
100.0%	100.0% #CCD2D9	RGB 204 210 217	#CCD2D9

#4D647B #5E748A #70859A #8596AA #9BA9B9 #B2BDC9 #CCD2D9

#4D647B - #8596AA - #CCD2D9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4D647B 0%, #8596AA 50%, #CCD2D9 100%);
    background: -webkit-linear-gradient(top, #4D647B 0%, #8596AA 50%, #CCD2D9 100%);
    background: linear-gradient(to bottom, #4D647B 0%, #8596AA 50%, #CCD2D9 100%);
}
</style>