#5E8ED6 - #B1CBDF | 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 #5E8ED6 to #B1CBDF

#5E8ED6 #B1CBDF

Calculate the color between two colors, #5E8ED6 and #B1CBDF. 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)

#5E8ED6 - #B1CBDF | 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 #5E8ED6 as 0% and #B1CBDF as 100%.

0.0%	0.0% #5E8ED6	RGB 94 142 214	#5E8ED6
16.7%	16.7% #6B98D7	RGB 107 152 215	#6B98D7
33.3%	33.3% #79A2D9	RGB 121 162 217	#79A2D9
50.0%	50.0% #87ACDA	RGB 135 172 218	#87ACDA
66.7%	66.7% #95B6DC	RGB 149 182 220	#95B6DC
83.3%	83.3% #A3C0DD	RGB 163 192 221	#A3C0DD
100.0%	100.0% #B1CBDF	RGB 177 203 223	#B1CBDF

#5E8ED6 #6B98D7 #79A2D9 #87ACDA #95B6DC #A3C0DD #B1CBDF

#5E8ED6 - #B1CBDF

HSV Blend

#5E8ED6 - #B1CBDF | 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 #5E8ED6 as 0% and #B1CBDF as 100%.

0.0%	0.0% #5E8DD6	RGB 94 141 214	#5E8DD6
16.7%	16.7% #6B99D7	RGB 107 153 215	#6B99D7
33.3%	33.3% #78A4D9	RGB 120 164 217	#78A4D9
50.0%	50.0% #86AFDA	RGB 134 175 218	#86AFDA
66.7%	66.7% #94B9DC	RGB 148 185 220	#94B9DC
83.3%	83.3% #A2C2DD	RGB 162 194 221	#A2C2DD
100.0%	100.0% #B1CBDF	RGB 177 203 223	#B1CBDF

#5E8DD6 #6B99D7 #78A4D9 #86AFDA #94B9DC #A2C2DD #B1CBDF

#5E8ED6 - #86AFDA - #B1CBDF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E8DD6 0%, #86AFDA 50%, #B1CBDF 100%);
    background: -webkit-linear-gradient(top, #5E8DD6 0%, #86AFDA 50%, #B1CBDF 100%);
    background: linear-gradient(to bottom, #5E8DD6 0%, #86AFDA 50%, #B1CBDF 100%);
}
</style>