#4D4AA1 - #CCCBE4 | 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 #4D4AA1 to #CCCBE4

#4D4AA1 #CCCBE4

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

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

0.0%	0.0% #4D4AA1	RGB 77 74 161	#4D4AA1
16.7%	16.7% #625FAC	RGB 98 95 172	#625FAC
33.3%	33.3% #7775B7	RGB 119 117 183	#7775B7
50.0%	50.0% #8C8AC2	RGB 140 138 194	#8C8AC2
66.7%	66.7% #A1A0CD	RGB 161 160 205	#A1A0CD
83.3%	83.3% #B6B5D8	RGB 182 181 216	#B6B5D8
100.0%	100.0% #CCCBE4	RGB 204 203 228	#CCCBE4

#4D4AA1 #625FAC #7775B7 #8C8AC2 #A1A0CD #B6B5D8 #CCCBE4

#4D4AA1 - #CCCBE4

HSV Blend

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

0.0%	0.0% #4C4AA1	RGB 76 74 161	#4C4AA1
16.7%	16.7% #5E5BAC	RGB 94 91 172	#5E5BAC
33.3%	33.3% #716EB7	RGB 113 110 183	#716EB7
50.0%	50.0% #8583C2	RGB 133 131 194	#8583C2
66.7%	66.7% #9B99CD	RGB 155 153 205	#9B99CD
83.3%	83.3% #B3B1D8	RGB 179 177 216	#B3B1D8
100.0%	100.0% #CCCBE4	RGB 204 203 228	#CCCBE4

#4C4AA1 #5E5BAC #716EB7 #8583C2 #9B99CD #B3B1D8 #CCCBE4

#4D4AA1 - #8583C2 - #CCCBE4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4C4AA1 0%, #8583C2 50%, #CCCBE4 100%);
    background: -webkit-linear-gradient(top, #4C4AA1 0%, #8583C2 50%, #CCCBE4 100%);
    background: linear-gradient(to bottom, #4C4AA1 0%, #8583C2 50%, #CCCBE4 100%);
}
</style>