#2F7FA3 - #8583EB | 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 #2F7FA3 to #8583EB

#2F7FA3 #8583EB

Calculate the color between two colors, #2F7FA3 and #8583EB. 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)

#2F7FA3 - #8583EB | 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 #2F7FA3 as 0% and #8583EB as 100%.

0.0%	0.0% #2F7FA3	RGB 47 127 163	#2F7FA3
16.7%	16.7% #3D7FAF	RGB 61 127 175	#3D7FAF
33.3%	33.3% #4B80BB	RGB 75 128 187	#4B80BB
50.0%	50.0% #5A81C7	RGB 90 129 199	#5A81C7
66.7%	66.7% #6881D3	RGB 104 129 211	#6881D3
83.3%	83.3% #7682DF	RGB 118 130 223	#7682DF
100.0%	100.0% #8583EB	RGB 133 131 235	#8583EB

#2F7FA3 #3D7FAF #4B80BB #5A81C7 #6881D3 #7682DF #8583EB

#2F7FA3 - #8583EB

HSV Blend

#2F7FA3 - #8583EB | 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 #2F7FA3 as 0% and #8583EB as 100%.

0.0%	0.0% #2F7FA3	RGB 47 127 163	#2F7FA3
16.7%	16.7% #3A7CAF	RGB 58 124 175	#3A7CAF
33.3%	33.3% #467BBB	RGB 70 123 187	#467BBB
50.0%	50.0% #547AC7	RGB 84 122 199	#547AC7
66.7%	66.7% #627BD3	RGB 98 123 211	#627BD3
83.3%	83.3% #727DDF	RGB 114 125 223	#727DDF
100.0%	100.0% #8583EB	RGB 133 131 235	#8583EB

#2F7FA3 #3A7CAF #467BBB #547AC7 #627BD3 #727DDF #8583EB

#2F7FA3 - #547AC7 - #8583EB

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2F7FA3 0%, #547AC7 50%, #8583EB 100%);
    background: -webkit-linear-gradient(top, #2F7FA3 0%, #547AC7 50%, #8583EB 100%);
    background: linear-gradient(to bottom, #2F7FA3 0%, #547AC7 50%, #8583EB 100%);
}
</style>