#4D559A - #CCCFE2 | 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 #4D559A to #CCCFE2

#4D559A #CCCFE2

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

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

0.0%	0.0% #4D559A	RGB 77 85 154	#4D559A
16.7%	16.7% #6269A6	RGB 98 105 166	#6269A6
33.3%	33.3% #777DB2	RGB 119 125 178	#777DB2
50.0%	50.0% #8C92BE	RGB 140 146 190	#8C92BE
66.7%	66.7% #A1A6CA	RGB 161 166 202	#A1A6CA
83.3%	83.3% #B6BAD6	RGB 182 186 214	#B6BAD6
100.0%	100.0% #CCCFE2	RGB 204 207 226	#CCCFE2

#4D559A #6269A6 #777DB2 #8C92BE #A1A6CA #B6BAD6 #CCCFE2

#4D559A - #CCCFE2

HSV Blend

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

0.0%	0.0% #4D559A	RGB 77 85 154	#4D559A
16.7%	16.7% #5E65A6	RGB 94 101 166	#5E65A6
33.3%	33.3% #7078B2	RGB 112 120 178	#7078B2
50.0%	50.0% #858CBE	RGB 133 140 190	#858CBE
66.7%	66.7% #9BA1CA	RGB 155 161 202	#9BA1CA
83.3%	83.3% #B2B7D6	RGB 178 183 214	#B2B7D6
100.0%	100.0% #CCCFE2	RGB 204 207 226	#CCCFE2

#4D559A #5E65A6 #7078B2 #858CBE #9BA1CA #B2B7D6 #CCCFE2

#4D559A - #858CBE - #CCCFE2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4D559A 0%, #858CBE 50%, #CCCFE2 100%);
    background: -webkit-linear-gradient(top, #4D559A 0%, #858CBE 50%, #CCCFE2 100%);
    background: linear-gradient(to bottom, #4D559A 0%, #858CBE 50%, #CCCFE2 100%);
}
</style>