#663E8F - #D3C7DF | 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 #663E8F to #D3C7DF

#663E8F #D3C7DF

Calculate the color between two colors, #663E8F and #D3C7DF. 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)

#663E8F - #D3C7DF | 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 #663E8F as 0% and #D3C7DF as 100%.

0.0%	0.0% #663E8F	RGB 102 62 143	#663E8F
16.7%	16.7% #78549C	RGB 120 84 156	#78549C
33.3%	33.3% #8A6BA9	RGB 138 107 169	#8A6BA9
50.0%	50.0% #9C82B7	RGB 156 130 183	#9C82B7
66.7%	66.7% #AE99C4	RGB 174 153 196	#AE99C4
83.3%	83.3% #C0B0D1	RGB 192 176 209	#C0B0D1
100.0%	100.0% #D3C7DF	RGB 211 199 223	#D3C7DF

#663E8F #78549C #8A6BA9 #9C82B7 #AE99C4 #C0B0D1 #D3C7DF

#663E8F - #D3C7DF

HSV Blend

#663E8F - #D3C7DF | 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 #663E8F as 0% and #D3C7DF as 100%.

0.0%	0.0% #663E8F	RGB 102 62 143	#663E8F
16.7%	16.7% #754F9C	RGB 117 79 156	#754F9C
33.3%	33.3% #8663A9	RGB 134 99 169	#8663A9
50.0%	50.0% #9779B7	RGB 151 121 183	#9779B7
66.7%	66.7% #AA91C4	RGB 170 145 196	#AA91C4
83.3%	83.3% #BEABD1	RGB 190 171 209	#BEABD1
100.0%	100.0% #D3C7DF	RGB 211 199 223	#D3C7DF

#663E8F #754F9C #8663A9 #9779B7 #AA91C4 #BEABD1 #D3C7DF

#663E8F - #9779B7 - #D3C7DF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #663E8F 0%, #9779B7 50%, #D3C7DF 100%);
    background: -webkit-linear-gradient(top, #663E8F 0%, #9779B7 50%, #D3C7DF 100%);
    background: linear-gradient(to bottom, #663E8F 0%, #9779B7 50%, #D3C7DF 100%);
}
</style>