#476A8C - #626FEC | 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 #476A8C to #626FEC

#476A8C #626FEC

Calculate the color between two colors, #476A8C and #626FEC. 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)

#476A8C - #626FEC | 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 #476A8C as 0% and #626FEC as 100%.

0.0%	0.0% #476A8C	RGB 71 106 140	#476A8C
16.7%	16.7% #4B6A9C	RGB 75 106 156	#4B6A9C
33.3%	33.3% #506BAC	RGB 80 107 172	#506BAC
50.0%	50.0% #546CBC	RGB 84 108 188	#546CBC
66.7%	66.7% #596DCC	RGB 89 109 204	#596DCC
83.3%	83.3% #5D6EDC	RGB 93 110 220	#5D6EDC
100.0%	100.0% #626FEC	RGB 98 111 236	#626FEC

#476A8C #4B6A9C #506BAC #546CBC #596DCC #5D6EDC #626FEC

#476A8C - #626FEC

HSV Blend

#476A8C - #626FEC | 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 #476A8C as 0% and #626FEC as 100%.

0.0%	0.0% #476A8C	RGB 71 106 140	#476A8C
16.7%	16.7% #4C6F9C	RGB 76 111 156	#4C6F9C
33.3%	33.3% #5173AC	RGB 81 115 172	#5173AC
50.0%	50.0% #5675BC	RGB 86 117 188	#5675BC
66.7%	66.7% #5A75CC	RGB 90 117 204	#5A75CC
83.3%	83.3% #5E73DC	RGB 94 115 220	#5E73DC
100.0%	100.0% #626FEC	RGB 98 111 236	#626FEC

#476A8C #4C6F9C #5173AC #5675BC #5A75CC #5E73DC #626FEC

#476A8C - #5675BC - #626FEC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #476A8C 0%, #5675BC 50%, #626FEC 100%);
    background: -webkit-linear-gradient(top, #476A8C 0%, #5675BC 50%, #626FEC 100%);
    background: linear-gradient(to bottom, #476A8C 0%, #5675BC 50%, #626FEC 100%);
}
</style>