#D4D7FF - #7777DF | 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 #D4D7FF to #7777DF

#D4D7FF #7777DF

Calculate the color between two colors, #D4D7FF and #7777DF. 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)

#D4D7FF - #7777DF | 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 #D4D7FF as 0% and #7777DF as 100%.

0.0%	0.0% #D4D7FF	RGB 212 215 255	#D4D7FF
16.7%	16.7% #C4C7F9	RGB 196 199 249	#C4C7F9
33.3%	33.3% #B5B7F4	RGB 181 183 244	#B5B7F4
50.0%	50.0% #A5A7EF	RGB 165 167 239	#A5A7EF
66.7%	66.7% #9697E9	RGB 150 151 233	#9697E9
83.3%	83.3% #8687E4	RGB 134 135 228	#8687E4
100.0%	100.0% #7777DF	RGB 119 119 223	#7777DF

#D4D7FF #C4C7F9 #B5B7F4 #A5A7EF #9697E9 #8687E4 #7777DF

#D4D7FF - #7777DF

HSV Blend

#D4D7FF - #7777DF | 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 #D4D7FF as 0% and #7777DF as 100%.

0.0%	0.0% #D4D7FF	RGB 212 215 255	#D4D7FF
16.7%	16.7% #C3C6F9	RGB 195 198 249	#C3C6F9
33.3%	33.3% #B2B5F4	RGB 178 181 244	#B2B5F4
50.0%	50.0% #A3A5EF	RGB 163 165 239	#A3A5EF
66.7%	66.7% #9395E9	RGB 147 149 233	#9395E9
83.3%	83.3% #8586E4	RGB 133 134 228	#8586E4
100.0%	100.0% #7777DF	RGB 119 119 223	#7777DF

#D4D7FF #C3C6F9 #B2B5F4 #A3A5EF #9395E9 #8586E4 #7777DF

#D4D7FF - #A3A5EF - #7777DF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #D4D7FF 0%, #A3A5EF 50%, #7777DF 100%);
    background: -webkit-linear-gradient(top, #D4D7FF 0%, #A3A5EF 50%, #7777DF 100%);
    background: linear-gradient(to bottom, #D4D7FF 0%, #A3A5EF 50%, #7777DF 100%);
}
</style>