#407A8F - #B8C2B5 | 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 #407A8F to #B8C2B5

#407A8F #B8C2B5

Calculate the color between two colors, #407A8F and #B8C2B5. 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)

#407A8F - #B8C2B5 | 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 #407A8F as 0% and #B8C2B5 as 100%.

0.0%	0.0% #407A8F	RGB 64 122 143	#407A8F
16.7%	16.7% #548695	RGB 84 134 149	#548695
33.3%	33.3% #68929B	RGB 104 146 155	#68929B
50.0%	50.0% #7C9EA2	RGB 124 158 162	#7C9EA2
66.7%	66.7% #90AAA8	RGB 144 170 168	#90AAA8
83.3%	83.3% #A4B6AE	RGB 164 182 174	#A4B6AE
100.0%	100.0% #B8C2B5	RGB 184 194 181	#B8C2B5

#407A8F #548695 #68929B #7C9EA2 #90AAA8 #A4B6AE #B8C2B5

#407A8F - #B8C2B5

HSV Blend

#407A8F - #B8C2B5 | 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 #407A8F as 0% and #B8C2B5 as 100%.

0.0%	0.0% #407A8F	RGB 64 122 143	#407A8F
16.7%	16.7% #509697	RGB 80 150 151	#509697
33.3%	33.3% #61A091	RGB 97 160 145	#61A091
50.0%	50.0% #74A88F	RGB 116 168 143	#74A88F
66.7%	66.7% #88B193	RGB 136 177 147	#88B193
83.3%	83.3% #9EB99E	RGB 158 185 158	#9EB99E
100.0%	100.0% #B8C2B5	RGB 184 194 181	#B8C2B5

#407A8F #509697 #61A091 #74A88F #88B193 #9EB99E #B8C2B5

#407A8F - #74A88F - #B8C2B5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #407A8F 0%, #74A88F 50%, #B8C2B5 100%);
    background: -webkit-linear-gradient(top, #407A8F 0%, #74A88F 50%, #B8C2B5 100%);
    background: linear-gradient(to bottom, #407A8F 0%, #74A88F 50%, #B8C2B5 100%);
}
</style>