#4D507A - #CCCDD9 | 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 #4D507A to #CCCDD9

#4D507A #CCCDD9

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

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

0.0%	0.0% #4D507A	RGB 77 80 122	#4D507A
16.7%	16.7% #626489	RGB 98 100 137	#626489
33.3%	33.3% #777999	RGB 119 121 153	#777999
50.0%	50.0% #8C8EA9	RGB 140 142 169	#8C8EA9
66.7%	66.7% #A1A3B9	RGB 161 163 185	#A1A3B9
83.3%	83.3% #B6B8C9	RGB 182 184 201	#B6B8C9
100.0%	100.0% #CCCDD9	RGB 204 205 217	#CCCDD9

#4D507A #626489 #777999 #8C8EA9 #A1A3B9 #B6B8C9 #CCCDD9

#4D507A - #CCCDD9

HSV Blend

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

0.0%	0.0% #4D507A	RGB 77 80 122	#4D507A
16.7%	16.7% #5E6189	RGB 94 97 137	#5E6189
33.3%	33.3% #707399	RGB 112 115 153	#707399
50.0%	50.0% #8587A9	RGB 133 135 169	#8587A9
66.7%	66.7% #9B9DB9	RGB 155 157 185	#9B9DB9
83.3%	83.3% #B2B4C9	RGB 178 180 201	#B2B4C9
100.0%	100.0% #CCCDD9	RGB 204 205 217	#CCCDD9

#4D507A #5E6189 #707399 #8587A9 #9B9DB9 #B2B4C9 #CCCDD9

#4D507A - #8587A9 - #CCCDD9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4D507A 0%, #8587A9 50%, #CCCDD9 100%);
    background: -webkit-linear-gradient(top, #4D507A 0%, #8587A9 50%, #CCCDD9 100%);
    background: linear-gradient(to bottom, #4D507A 0%, #8587A9 50%, #CCCDD9 100%);
}
</style>