#2F45D4 - #C3C9F2 | 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 #2F45D4 to #C3C9F2

#2F45D4 #C3C9F2

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

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

0.0%	0.0% #2F45D4	RGB 47 69 212	#2F45D4
16.7%	16.7% #475BD9	RGB 71 91 217	#475BD9
33.3%	33.3% #6071DE	RGB 96 113 222	#6071DE
50.0%	50.0% #7987E3	RGB 121 135 227	#7987E3
66.7%	66.7% #919DE8	RGB 145 157 232	#919DE8
83.3%	83.3% #AAB3ED	RGB 170 179 237	#AAB3ED
100.0%	100.0% #C3C9F2	RGB 195 201 242	#C3C9F2

#2F45D4 #475BD9 #6071DE #7987E3 #919DE8 #AAB3ED #C3C9F2

#2F45D4 - #C3C9F2

HSV Blend

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

0.0%	0.0% #2F44D4	RGB 47 68 212	#2F44D4
16.7%	16.7% #4558D9	RGB 69 88 217	#4558D9
33.3%	33.3% #5C6DDE	RGB 92 109 222	#5C6DDE
50.0%	50.0% #7483E3	RGB 116 131 227	#7483E3
66.7%	66.7% #8D99E8	RGB 141 153 232	#8D99E8
83.3%	83.3% #A7B0ED	RGB 167 176 237	#A7B0ED
100.0%	100.0% #C3C9F2	RGB 195 201 242	#C3C9F2

#2F44D4 #4558D9 #5C6DDE #7483E3 #8D99E8 #A7B0ED #C3C9F2

#2F45D4 - #7483E3 - #C3C9F2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2F44D4 0%, #7483E3 50%, #C3C9F2 100%);
    background: -webkit-linear-gradient(top, #2F44D4 0%, #7483E3 50%, #C3C9F2 100%);
    background: linear-gradient(to bottom, #2F44D4 0%, #7483E3 50%, #C3C9F2 100%);
}
</style>