#9FAAC3 - #485A8F | 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 #9FAAC3 to #485A8F

#9FAAC3 #485A8F

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

#9FAAC3 - #485A8F | 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 #9FAAC3 as 0% and #485A8F as 100%.

0.0%	0.0% #9FAAC3	RGB 159 170 195	#9FAAC3
16.7%	16.7% #909CBA	RGB 144 156 186	#909CBA
33.3%	33.3% #828FB1	RGB 130 143 177	#828FB1
50.0%	50.0% #7382A9	RGB 115 130 169	#7382A9
66.7%	66.7% #6574A0	RGB 101 116 160	#6574A0
83.3%	83.3% #566797	RGB 86 103 151	#566797
100.0%	100.0% #485A8F	RGB 72 90 143	#485A8F

#9FAAC3 #909CBA #828FB1 #7382A9 #6574A0 #566797 #485A8F

#9FAAC3 - #485A8F

HSV Blend

#9FAAC3 - #485A8F | 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 #9FAAC3 as 0% and #485A8F as 100%.

0.0%	0.0% #9FAAC3	RGB 159 170 195	#9FAAC3
16.7%	16.7% #8E9BBA	RGB 142 155 186	#8E9BBA
33.3%	33.3% #7E8DB1	RGB 126 141 177	#7E8DB1
50.0%	50.0% #6F7FA9	RGB 111 127 169	#6F7FA9
66.7%	66.7% #6172A0	RGB 97 114 160	#6172A0
83.3%	83.3% #546597	RGB 84 101 151	#546597
100.0%	100.0% #485A8F	RGB 72 90 143	#485A8F

#9FAAC3 #8E9BBA #7E8DB1 #6F7FA9 #6172A0 #546597 #485A8F

#9FAAC3 - #6F7FA9 - #485A8F

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #9FAAC3 0%, #6F7FA9 50%, #485A8F 100%);
    background: -webkit-linear-gradient(top, #9FAAC3 0%, #6F7FA9 50%, #485A8F 100%);
    background: linear-gradient(to bottom, #9FAAC3 0%, #6F7FA9 50%, #485A8F 100%);
}
</style>