#9FBCBC - #499AA3 | 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 #9FBCBC to #499AA3

#9FBCBC #499AA3

Calculate the color between two colors, #9FBCBC and #499AA3. 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)

#9FBCBC - #499AA3 | 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 #9FBCBC as 0% and #499AA3 as 100%.

0.0%	0.0% #9FBCBC	RGB 159 188 188	#9FBCBC
16.7%	16.7% #90B6B7	RGB 144 182 183	#90B6B7
33.3%	33.3% #82B0B3	RGB 130 176 179	#82B0B3
50.0%	50.0% #74ABAF	RGB 116 171 175	#74ABAF
66.7%	66.7% #65A5AB	RGB 101 165 171	#65A5AB
83.3%	83.3% #579FA7	RGB 87 159 167	#579FA7
100.0%	100.0% #499AA3	RGB 73 154 163	#499AA3

#9FBCBC #90B6B7 #82B0B3 #74ABAF #65A5AB #579FA7 #499AA3

#9FBCBC - #499AA3

HSV Blend

#9FBCBC - #499AA3 | 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 #9FBCBC as 0% and #499AA3 as 100%.

0.0%	0.0% #9FBCBC	RGB 159 188 188	#9FBCBC
16.7%	16.7% #8FB7B7	RGB 143 183 183	#8FB7B7
33.3%	33.3% #80B1B3	RGB 128 177 179	#80B1B3
50.0%	50.0% #71ACAF	RGB 113 172 175	#71ACAF
66.7%	66.7% #63A6AB	RGB 99 166 171	#63A6AB
83.3%	83.3% #55A0A7	RGB 85 160 167	#55A0A7
100.0%	100.0% #499AA3	RGB 73 154 163	#499AA3

#9FBCBC #8FB7B7 #80B1B3 #71ACAF #63A6AB #55A0A7 #499AA3

#9FBCBC - #71ACAF - #499AA3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #9FBCBC 0%, #71ACAF 50%, #499AA3 100%);
    background: -webkit-linear-gradient(top, #9FBCBC 0%, #71ACAF 50%, #499AA3 100%);
    background: linear-gradient(to bottom, #9FBCBC 0%, #71ACAF 50%, #499AA3 100%);
}
</style>