#5337A0 - #CDC5E3 | 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 #5337A0 to #CDC5E3

#5337A0 #CDC5E3

Calculate the color between two colors, #5337A0 and #CDC5E3. 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)

#5337A0 - #CDC5E3 | 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 #5337A0 as 0% and #CDC5E3 as 100%.

0.0%	0.0% #5337A0	RGB 83 55 160	#5337A0
16.7%	16.7% #674EAB	RGB 103 78 171	#674EAB
33.3%	33.3% #7B66B6	RGB 123 102 182	#7B66B6
50.0%	50.0% #907EC1	RGB 144 126 193	#907EC1
66.7%	66.7% #A495CC	RGB 164 149 204	#A495CC
83.3%	83.3% #B8ADD7	RGB 184 173 215	#B8ADD7
100.0%	100.0% #CDC5E3	RGB 205 197 227	#CDC5E3

#5337A0 #674EAB #7B66B6 #907EC1 #A495CC #B8ADD7 #CDC5E3

#5337A0 - #CDC5E3

HSV Blend

#5337A0 - #CDC5E3 | 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 #5337A0 as 0% and #CDC5E3 as 100%.

0.0%	0.0% #5337A0	RGB 83 55 160	#5337A0
16.7%	16.7% #6349AB	RGB 99 73 171	#6349AB
33.3%	33.3% #755EB6	RGB 117 94 182	#755EB6
50.0%	50.0% #8975C1	RGB 137 117 193	#8975C1
66.7%	66.7% #9E8DCC	RGB 158 141 204	#9E8DCC
83.3%	83.3% #B5A8D7	RGB 181 168 215	#B5A8D7
100.0%	100.0% #CDC5E3	RGB 205 197 227	#CDC5E3

#5337A0 #6349AB #755EB6 #8975C1 #9E8DCC #B5A8D7 #CDC5E3

#5337A0 - #8975C1 - #CDC5E3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5337A0 0%, #8975C1 50%, #CDC5E3 100%);
    background: -webkit-linear-gradient(top, #5337A0 0%, #8975C1 50%, #CDC5E3 100%);
    background: linear-gradient(to bottom, #5337A0 0%, #8975C1 50%, #CDC5E3 100%);
}
</style>