#100C5E - #BAB9D1 | 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 #100C5E to #BAB9D1

#100C5E #BAB9D1

Calculate the color between two colors, #100C5E and #BAB9D1. 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)

#100C5E - #BAB9D1 | 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 #100C5E as 0% and #BAB9D1 as 100%.

0.0%	0.0% #100C5E	RGB 16 12 94	#100C5E
16.7%	16.7% #2C2871	RGB 44 40 113	#2C2871
33.3%	33.3% #484584	RGB 72 69 132	#484584
50.0%	50.0% #656297	RGB 101 98 151	#656297
66.7%	66.7% #817FAA	RGB 129 127 170	#817FAA
83.3%	83.3% #9D9CBD	RGB 157 156 189	#9D9CBD
100.0%	100.0% #BAB9D1	RGB 186 185 209	#BAB9D1

#100C5E #2C2871 #484584 #656297 #817FAA #9D9CBD #BAB9D1

#100C5E - #BAB9D1

HSV Blend

#100C5E - #BAB9D1 | 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 #100C5E as 0% and #BAB9D1 as 100%.

0.0%	0.0% #100B5E	RGB 16 11 94	#100B5E
16.7%	16.7% #201C71	RGB 32 28 113	#201C71
33.3%	33.3% #363284	RGB 54 50 132	#363284
50.0%	50.0% #504C97	RGB 80 76 151	#504C97
66.7%	66.7% #6E6BAA	RGB 110 107 170	#6E6BAA
83.3%	83.3% #9290BD	RGB 146 144 189	#9290BD
100.0%	100.0% #BAB9D1	RGB 186 185 209	#BAB9D1

#100B5E #201C71 #363284 #504C97 #6E6BAA #9290BD #BAB9D1

#100C5E - #504C97 - #BAB9D1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #100B5E 0%, #504C97 50%, #BAB9D1 100%);
    background: -webkit-linear-gradient(top, #100B5E 0%, #504C97 50%, #BAB9D1 100%);
    background: linear-gradient(to bottom, #100B5E 0%, #504C97 50%, #BAB9D1 100%);
}
</style>