#4D667B - #CCD3D9 | 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 #4D667B to #CCD3D9

#4D667B #CCD3D9

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

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

0.0%	0.0% #4D667B	RGB 77 102 123	#4D667B
16.7%	16.7% #62788A	RGB 98 120 138	#62788A
33.3%	33.3% #778A9A	RGB 119 138 154	#778A9A
50.0%	50.0% #8C9CAA	RGB 140 156 170	#8C9CAA
66.7%	66.7% #A1AEB9	RGB 161 174 185	#A1AEB9
83.3%	83.3% #B6C0C9	RGB 182 192 201	#B6C0C9
100.0%	100.0% #CCD3D9	RGB 204 211 217	#CCD3D9

#4D667B #62788A #778A9A #8C9CAA #A1AEB9 #B6C0C9 #CCD3D9

#4D667B - #CCD3D9

HSV Blend

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

0.0%	0.0% #4D667B	RGB 77 102 123	#4D667B
16.7%	16.7% #5E768A	RGB 94 118 138	#5E768A
33.3%	33.3% #70879A	RGB 112 135 154	#70879A
50.0%	50.0% #8599AA	RGB 133 153 170	#8599AA
66.7%	66.7% #9BABB9	RGB 155 171 185	#9BABB9
83.3%	83.3% #B2BEC9	RGB 178 190 201	#B2BEC9
100.0%	100.0% #CCD3D9	RGB 204 211 217	#CCD3D9

#4D667B #5E768A #70879A #8599AA #9BABB9 #B2BEC9 #CCD3D9

#4D667B - #8599AA - #CCD3D9

CSS codes

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

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