#AF4DC4 - #DF6FFF | 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 #AF4DC4 to #DF6FFF

#AF4DC4 #DF6FFF

Calculate the color between two colors, #AF4DC4 and #DF6FFF. 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)

#AF4DC4 - #DF6FFF | 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 #AF4DC4 as 0% and #DF6FFF as 100%.

0.0%	0.0% #AF4DC4	RGB 175 77 196	#AF4DC4
16.7%	16.7% #B752CD	RGB 183 82 205	#B752CD
33.3%	33.3% #BF58D7	RGB 191 88 215	#BF58D7
50.0%	50.0% #C75EE1	RGB 199 94 225	#C75EE1
66.7%	66.7% #CF63EB	RGB 207 99 235	#CF63EB
83.3%	83.3% #D769F5	RGB 215 105 245	#D769F5
100.0%	100.0% #DF6FFF	RGB 223 111 255	#DF6FFF

#AF4DC4 #B752CD #BF58D7 #C75EE1 #CF63EB #D769F5 #DF6FFF

#AF4DC4 - #DF6FFF

HSV Blend

#AF4DC4 - #DF6FFF | 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 #AF4DC4 as 0% and #DF6FFF as 100%.

0.0%	0.0% #AF4DC4	RGB 175 77 196	#AF4DC4
16.7%	16.7% #B752CD	RGB 183 82 205	#B752CD
33.3%	33.3% #BF57D7	RGB 191 87 215	#BF57D7
50.0%	50.0% #C75DE1	RGB 199 93 225	#C75DE1
66.7%	66.7% #CF63EB	RGB 207 99 235	#CF63EB
83.3%	83.3% #D768F5	RGB 215 104 245	#D768F5
100.0%	100.0% #DF6FFF	RGB 223 111 255	#DF6FFF

#AF4DC4 #B752CD #BF57D7 #C75DE1 #CF63EB #D768F5 #DF6FFF

#AF4DC4 - #C75DE1 - #DF6FFF

CSS codes

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

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