#2020DA - #BFBFF4 | 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 #2020DA to #BFBFF4

#2020DA #BFBFF4

Calculate the color between two colors, #2020DA and #BFBFF4. 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)

#2020DA - #BFBFF4 | 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 #2020DA as 0% and #BFBFF4 as 100%.

0.0%	0.0% #2020DA	RGB 32 32 218	#2020DA
16.7%	16.7% #3A3ADE	RGB 58 58 222	#3A3ADE
33.3%	33.3% #5555E2	RGB 85 85 226	#5555E2
50.0%	50.0% #6F6FE7	RGB 111 111 231	#6F6FE7
66.7%	66.7% #8A8AEB	RGB 138 138 235	#8A8AEB
83.3%	83.3% #A4A4EF	RGB 164 164 239	#A4A4EF
100.0%	100.0% #BFBFF4	RGB 191 191 244	#BFBFF4

#2020DA #3A3ADE #5555E2 #6F6FE7 #8A8AEB #A4A4EF #BFBFF4

#2020DA - #BFBFF4

HSV Blend

#2020DA - #BFBFF4 | 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 #2020DA as 0% and #BFBFF4 as 100%.

0.0%	0.0% #2020DA	RGB 32 32 218	#2020DA
16.7%	16.7% #3838DE	RGB 56 56 222	#3838DE
33.3%	33.3% #5151E2	RGB 81 81 226	#5151E2
50.0%	50.0% #6B6BE7	RGB 107 107 231	#6B6BE7
66.7%	66.7% #8686EB	RGB 134 134 235	#8686EB
83.3%	83.3% #A2A2EF	RGB 162 162 239	#A2A2EF
100.0%	100.0% #BFBFF4	RGB 191 191 244	#BFBFF4

#2020DA #3838DE #5151E2 #6B6BE7 #8686EB #A2A2EF #BFBFF4

#2020DA - #6B6BE7 - #BFBFF4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2020DA 0%, #6B6BE7 50%, #BFBFF4 100%);
    background: -webkit-linear-gradient(top, #2020DA 0%, #6B6BE7 50%, #BFBFF4 100%);
    background: linear-gradient(to bottom, #2020DA 0%, #6B6BE7 50%, #BFBFF4 100%);
}
</style>