#474C5E - #906ED2 | 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 #474C5E to #906ED2

#474C5E #906ED2

Calculate the color between two colors, #474C5E and #906ED2. 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)

#474C5E - #906ED2 | 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 #474C5E as 0% and #906ED2 as 100%.

0.0%	0.0% #474C5E	RGB 71 76 94	#474C5E
16.7%	16.7% #535171	RGB 83 81 113	#535171
33.3%	33.3% #5F5784	RGB 95 87 132	#5F5784
50.0%	50.0% #6B5D98	RGB 107 93 152	#6B5D98
66.7%	66.7% #7762AB	RGB 119 98 171	#7762AB
83.3%	83.3% #8368BE	RGB 131 104 190	#8368BE
100.0%	100.0% #906ED2	RGB 144 110 210	#906ED2

#474C5E #535171 #5F5784 #6B5D98 #7762AB #8368BE #906ED2

#474C5E - #906ED2

HSV Blend

#474C5E - #906ED2 | 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 #474C5E as 0% and #906ED2 as 100%.

0.0%	0.0% #474B5E	RGB 71 75 94	#474B5E
16.7%	16.7% #515571	RGB 81 85 113	#515571
33.3%	33.3% #595B84	RGB 89 91 132	#595B84
50.0%	50.0% #646198	RGB 100 97 152	#646198
66.7%	66.7% #7166AB	RGB 113 102 171	#7166AB
83.3%	83.3% #7F6BBE	RGB 127 107 190	#7F6BBE
100.0%	100.0% #906ED2	RGB 144 110 210	#906ED2

#474B5E #515571 #595B84 #646198 #7166AB #7F6BBE #906ED2

#474C5E - #646198 - #906ED2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #474B5E 0%, #646198 50%, #906ED2 100%);
    background: -webkit-linear-gradient(top, #474B5E 0%, #646198 50%, #906ED2 100%);
    background: linear-gradient(to bottom, #474B5E 0%, #646198 50%, #906ED2 100%);
}
</style>