#9DB2FF - #4671EF | 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 #9DB2FF to #4671EF

#9DB2FF #4671EF

Calculate the color between two colors, #9DB2FF and #4671EF. 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)

#9DB2FF - #4671EF | 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 #9DB2FF as 0% and #4671EF as 100%.

0.0%	0.0% #9DB2FF	RGB 157 178 255	#9DB2FF
16.7%	16.7% #8EA7FC	RGB 142 167 252	#8EA7FC
33.3%	33.3% #809CF9	RGB 128 156 249	#809CF9
50.0%	50.0% #7191F7	RGB 113 145 247	#7191F7
66.7%	66.7% #6386F4	RGB 99 134 244	#6386F4
83.3%	83.3% #547BF1	RGB 84 123 241	#547BF1
100.0%	100.0% #4671EF	RGB 70 113 239	#4671EF

#9DB2FF #8EA7FC #809CF9 #7191F7 #6386F4 #547BF1 #4671EF

#9DB2FF - #4671EF

HSV Blend

#9DB2FF - #4671EF | 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 #9DB2FF as 0% and #4671EF as 100%.

0.0%	0.0% #9DB2FF	RGB 157 178 255	#9DB2FF
16.7%	16.7% #8DA6FC	RGB 141 166 252	#8DA6FC
33.3%	33.3% #7E9AF9	RGB 126 154 249	#7E9AF9
50.0%	50.0% #708FF7	RGB 112 143 247	#708FF7
66.7%	66.7% #6185F4	RGB 97 133 244	#6185F4
83.3%	83.3% #537AF1	RGB 83 122 241	#537AF1
100.0%	100.0% #4671EF	RGB 70 113 239	#4671EF

#9DB2FF #8DA6FC #7E9AF9 #708FF7 #6185F4 #537AF1 #4671EF

#9DB2FF - #708FF7 - #4671EF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #9DB2FF 0%, #708FF7 50%, #4671EF 100%);
    background: -webkit-linear-gradient(top, #9DB2FF 0%, #708FF7 50%, #4671EF 100%);
    background: linear-gradient(to bottom, #9DB2FF 0%, #708FF7 50%, #4671EF 100%);
}
</style>