#9CADEF - #3C57BA | 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 #9CADEF to #3C57BA

#9CADEF #3C57BA

Calculate the color between two colors, #9CADEF and #3C57BA. 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)

#9CADEF - #3C57BA | 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 #9CADEF as 0% and #3C57BA as 100%.

0.0%	0.0% #9CADEF	RGB 156 173 239	#9CADEF
16.7%	16.7% #8C9EE6	RGB 140 158 230	#8C9EE6
33.3%	33.3% #7C90DD	RGB 124 144 221	#7C90DD
50.0%	50.0% #6C82D4	RGB 108 130 212	#6C82D4
66.7%	66.7% #5C73CB	RGB 92 115 203	#5C73CB
83.3%	83.3% #4C65C2	RGB 76 101 194	#4C65C2
100.0%	100.0% #3C57BA	RGB 60 87 186	#3C57BA

#9CADEF #8C9EE6 #7C90DD #6C82D4 #5C73CB #4C65C2 #3C57BA

#9CADEF - #3C57BA

HSV Blend

#9CADEF - #3C57BA | 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 #9CADEF as 0% and #3C57BA as 100%.

0.0%	0.0% #9CACEF	RGB 156 172 239	#9CACEF
16.7%	16.7% #899CE6	RGB 137 156 230	#899CE6
33.3%	33.3% #788DDD	RGB 120 141 221	#788DDD
50.0%	50.0% #677ED4	RGB 103 126 212	#677ED4
66.7%	66.7% #5870CB	RGB 88 112 203	#5870CB
83.3%	83.3% #4963C2	RGB 73 99 194	#4963C2
100.0%	100.0% #3C57BA	RGB 60 87 186	#3C57BA

#9CACEF #899CE6 #788DDD #677ED4 #5870CB #4963C2 #3C57BA

#9CADEF - #677ED4 - #3C57BA

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #9CACEF 0%, #677ED4 50%, #3C57BA 100%);
    background: -webkit-linear-gradient(top, #9CACEF 0%, #677ED4 50%, #3C57BA 100%);
    background: linear-gradient(to bottom, #9CACEF 0%, #677ED4 50%, #3C57BA 100%);
}
</style>