#2B5AC1 - #C2CFED | 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 #2B5AC1 to #C2CFED

#2B5AC1 #C2CFED

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

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

0.0%	0.0% #2B5AC1	RGB 43 90 193	#2B5AC1
16.7%	16.7% #446DC8	RGB 68 109 200	#446DC8
33.3%	33.3% #5D81CF	RGB 93 129 207	#5D81CF
50.0%	50.0% #7694D7	RGB 118 148 215	#7694D7
66.7%	66.7% #8FA8DE	RGB 143 168 222	#8FA8DE
83.3%	83.3% #A8BBE5	RGB 168 187 229	#A8BBE5
100.0%	100.0% #C2CFED	RGB 194 207 237	#C2CFED

#2B5AC1 #446DC8 #5D81CF #7694D7 #8FA8DE #A8BBE5 #C2CFED

#2B5AC1 - #C2CFED

HSV Blend

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

0.0%	0.0% #2B5AC1	RGB 43 90 193	#2B5AC1
16.7%	16.7% #406AC8	RGB 64 106 200	#406AC8
33.3%	33.3% #577CCF	RGB 87 124 207	#577CCF
50.0%	50.0% #6F8FD7	RGB 111 143 215	#6F8FD7
66.7%	66.7% #89A3DE	RGB 137 163 222	#89A3DE
83.3%	83.3% #A5B8E5	RGB 165 184 229	#A5B8E5
100.0%	100.0% #C2CFED	RGB 194 207 237	#C2CFED

#2B5AC1 #406AC8 #577CCF #6F8FD7 #89A3DE #A5B8E5 #C2CFED

#2B5AC1 - #6F8FD7 - #C2CFED

CSS codes

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

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