#4D6871 - #CCD4D6 | 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 #4D6871 to #CCD4D6

#4D6871 #CCD4D6

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

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

0.0%	0.0% #4D6871	RGB 77 104 113	#4D6871
16.7%	16.7% #627A81	RGB 98 122 129	#627A81
33.3%	33.3% #778C92	RGB 119 140 146	#778C92
50.0%	50.0% #8C9EA3	RGB 140 158 163	#8C9EA3
66.7%	66.7% #A1B0B4	RGB 161 176 180	#A1B0B4
83.3%	83.3% #B6C2C5	RGB 182 194 197	#B6C2C5
100.0%	100.0% #CCD4D6	RGB 204 212 214	#CCD4D6

#4D6871 #627A81 #778C92 #8C9EA3 #A1B0B4 #B6C2C5 #CCD4D6

#4D6871 - #CCD4D6

HSV Blend

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

0.0%	0.0% #4D6871	RGB 77 104 113	#4D6871
16.7%	16.7% #5E7981	RGB 94 121 129	#5E7981
33.3%	33.3% #718A92	RGB 113 138 146	#718A92
50.0%	50.0% #859CA3	RGB 133 156 163	#859CA3
66.7%	66.7% #9BAEB4	RGB 155 174 180	#9BAEB4
83.3%	83.3% #B3C1C5	RGB 179 193 197	#B3C1C5
100.0%	100.0% #CCD4D6	RGB 204 212 214	#CCD4D6

#4D6871 #5E7981 #718A92 #859CA3 #9BAEB4 #B3C1C5 #CCD4D6

#4D6871 - #859CA3 - #CCD4D6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4D6871 0%, #859CA3 50%, #CCD4D6 100%);
    background: -webkit-linear-gradient(top, #4D6871 0%, #859CA3 50%, #CCD4D6 100%);
    background: linear-gradient(to bottom, #4D6871 0%, #859CA3 50%, #CCD4D6 100%);
}
</style>