#96B5D9 - #3F649C | 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 #96B5D9 to #3F649C

#96B5D9 #3F649C

Calculate the color between two colors, #96B5D9 and #3F649C. 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)

#96B5D9 - #3F649C | 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 #96B5D9 as 0% and #3F649C as 100%.

0.0%	0.0% #96B5D9	RGB 150 181 217	#96B5D9
16.7%	16.7% #87A7CE	RGB 135 167 206	#87A7CE
33.3%	33.3% #799AC4	RGB 121 154 196	#799AC4
50.0%	50.0% #6A8CBA	RGB 106 140 186	#6A8CBA
66.7%	66.7% #5C7FB0	RGB 92 127 176	#5C7FB0
83.3%	83.3% #4D71A6	RGB 77 113 166	#4D71A6
100.0%	100.0% #3F649C	RGB 63 100 156	#3F649C

#96B5D9 #87A7CE #799AC4 #6A8CBA #5C7FB0 #4D71A6 #3F649C

#96B5D9 - #3F649C

HSV Blend

#96B5D9 - #3F649C | 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 #96B5D9 as 0% and #3F649C as 100%.

0.0%	0.0% #96B4D9	RGB 150 180 217	#96B4D9
16.7%	16.7% #85A6CE	RGB 133 166 206	#85A6CE
33.3%	33.3% #7598C4	RGB 117 152 196	#7598C4
50.0%	50.0% #668ABA	RGB 102 138 186	#668ABA
66.7%	66.7% #587DB0	RGB 88 125 176	#587DB0
83.3%	83.3% #4B70A6	RGB 75 112 166	#4B70A6
100.0%	100.0% #3F649C	RGB 63 100 156	#3F649C

#96B4D9 #85A6CE #7598C4 #668ABA #587DB0 #4B70A6 #3F649C

#96B5D9 - #668ABA - #3F649C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #96B4D9 0%, #668ABA 50%, #3F649C 100%);
    background: -webkit-linear-gradient(top, #96B4D9 0%, #668ABA 50%, #3F649C 100%);
    background: linear-gradient(to bottom, #96B4D9 0%, #668ABA 50%, #3F649C 100%);
}
</style>