#2B87BA - #C2DCEB | 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 #2B87BA to #C2DCEB

#2B87BA #C2DCEB

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

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

0.0%	0.0% #2B87BA	RGB 43 135 186	#2B87BA
16.7%	16.7% #4495C2	RGB 68 149 194	#4495C2
33.3%	33.3% #5DA3CA	RGB 93 163 202	#5DA3CA
50.0%	50.0% #76B1D2	RGB 118 177 210	#76B1D2
66.7%	66.7% #8FBFDA	RGB 143 191 218	#8FBFDA
83.3%	83.3% #A8CDE2	RGB 168 205 226	#A8CDE2
100.0%	100.0% #C2DCEB	RGB 194 220 235	#C2DCEB

#2B87BA #4495C2 #5DA3CA #76B1D2 #8FBFDA #A8CDE2 #C2DCEB

#2B87BA - #C2DCEB

HSV Blend

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

0.0%	0.0% #2B87BA	RGB 43 135 186	#2B87BA
16.7%	16.7% #4093C2	RGB 64 147 194	#4093C2
33.3%	33.3% #56A0CA	RGB 86 160 202	#56A0CA
50.0%	50.0% #6FAED2	RGB 111 174 210	#6FAED2
66.7%	66.7% #89BDDA	RGB 137 189 218	#89BDDA
83.3%	83.3% #A4CCE2	RGB 164 204 226	#A4CCE2
100.0%	100.0% #C2DCEB	RGB 194 220 235	#C2DCEB

#2B87BA #4093C2 #56A0CA #6FAED2 #89BDDA #A4CCE2 #C2DCEB

#2B87BA - #6FAED2 - #C2DCEB

CSS codes

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

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