#2F3669 - #C3C5D4 | 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 #2F3669 to #C3C5D4

#2F3669 #C3C5D4

Calculate the color between two colors, #2F3669 and #C3C5D4. 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)

#2F3669 - #C3C5D4 | 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 #2F3669 as 0% and #C3C5D4 as 100%.

0.0%	0.0% #2F3669	RGB 47 54 105	#2F3669
16.7%	16.7% #474D7A	RGB 71 77 122	#474D7A
33.3%	33.3% #60658C	RGB 96 101 140	#60658C
50.0%	50.0% #797D9E	RGB 121 125 158	#797D9E
66.7%	66.7% #9195B0	RGB 145 149 176	#9195B0
83.3%	83.3% #AAADC2	RGB 170 173 194	#AAADC2
100.0%	100.0% #C3C5D4	RGB 195 197 212	#C3C5D4

#2F3669 #474D7A #60658C #797D9E #9195B0 #AAADC2 #C3C5D4

#2F3669 - #C3C5D4

HSV Blend

#2F3669 - #C3C5D4 | 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 #2F3669 as 0% and #C3C5D4 as 100%.

0.0%	0.0% #2F3669	RGB 47 54 105	#2F3669
16.7%	16.7% #40477A	RGB 64 71 122	#40477A
33.3%	33.3% #555B8C	RGB 85 91 140	#555B8C
50.0%	50.0% #6C729E	RGB 108 114 158	#6C729E
66.7%	66.7% #868BB0	RGB 134 139 176	#868BB0
83.3%	83.3% #A3A6C2	RGB 163 166 194	#A3A6C2
100.0%	100.0% #C3C5D4	RGB 195 197 212	#C3C5D4

#2F3669 #40477A #555B8C #6C729E #868BB0 #A3A6C2 #C3C5D4

#2F3669 - #6C729E - #C3C5D4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2F3669 0%, #6C729E 50%, #C3C5D4 100%);
    background: -webkit-linear-gradient(top, #2F3669 0%, #6C729E 50%, #C3C5D4 100%);
    background: linear-gradient(to bottom, #2F3669 0%, #6C729E 50%, #C3C5D4 100%);
}
</style>