#DF7DFF - #AF2DE6 | 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 #DF7DFF to #AF2DE6

#DF7DFF #AF2DE6

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

#DF7DFF - #AF2DE6 | 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 #DF7DFF as 0% and #AF2DE6 as 100%.

0.0%	0.0% #DF7DFF	RGB 223 125 255	#DF7DFF
16.7%	16.7% #D76FFA	RGB 215 111 250	#D76FFA
33.3%	33.3% #CF62F6	RGB 207 98 246	#CF62F6
50.0%	50.0% #C755F2	RGB 199 85 242	#C755F2
66.7%	66.7% #BF47EE	RGB 191 71 238	#BF47EE
83.3%	83.3% #B73AEA	RGB 183 58 234	#B73AEA
100.0%	100.0% #AF2DE6	RGB 175 45 230	#AF2DE6

#DF7DFF #D76FFA #CF62F6 #C755F2 #BF47EE #B73AEA #AF2DE6

#DF7DFF - #AF2DE6

HSV Blend

#DF7DFF - #AF2DE6 | 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 #DF7DFF as 0% and #AF2DE6 as 100%.

0.0%	0.0% #DF7DFF	RGB 223 125 255	#DF7DFF
16.7%	16.7% #D76EFA	RGB 215 110 250	#D76EFA
33.3%	33.3% #CF60F6	RGB 207 96 246	#CF60F6
50.0%	50.0% #C753F2	RGB 199 83 242	#C753F2
66.7%	66.7% #BF46EE	RGB 191 70 238	#BF46EE
83.3%	83.3% #B739EA	RGB 183 57 234	#B739EA
100.0%	100.0% #AF2DE6	RGB 175 45 230	#AF2DE6

#DF7DFF #D76EFA #CF60F6 #C753F2 #BF46EE #B739EA #AF2DE6

#DF7DFF - #C753F2 - #AF2DE6

CSS codes

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

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