#B5CBDB - #5E7DA1 | 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 #B5CBDB to #5E7DA1

#B5CBDB #5E7DA1

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

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

0.0%	0.0% #B5CBDB	RGB 181 203 219	#B5CBDB
16.7%	16.7% #A6BED1	RGB 166 190 209	#A6BED1
33.3%	33.3% #98B1C7	RGB 152 177 199	#98B1C7
50.0%	50.0% #89A4BE	RGB 137 164 190	#89A4BE
66.7%	66.7% #7B97B4	RGB 123 151 180	#7B97B4
83.3%	83.3% #6C8AAA	RGB 108 138 170	#6C8AAA
100.0%	100.0% #5E7DA1	RGB 94 125 161	#5E7DA1

#B5CBDB #A6BED1 #98B1C7 #89A4BE #7B97B4 #6C8AAA #5E7DA1

#B5CBDB - #5E7DA1

HSV Blend

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

0.0%	0.0% #B5CBDB	RGB 181 203 219	#B5CBDB
16.7%	16.7% #A4BDD1	RGB 164 189 209	#A4BDD1
33.3%	33.3% #94B0C7	RGB 148 176 199	#94B0C7
50.0%	50.0% #85A3BE	RGB 133 163 190	#85A3BE
66.7%	66.7% #7796B4	RGB 119 150 180	#7796B4
83.3%	83.3% #6A89AA	RGB 106 137 170	#6A89AA
100.0%	100.0% #5E7DA1	RGB 94 125 161	#5E7DA1

#B5CBDB #A4BDD1 #94B0C7 #85A3BE #7796B4 #6A89AA #5E7DA1

#B5CBDB - #85A3BE - #5E7DA1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B5CBDB 0%, #85A3BE 50%, #5E7DA1 100%);
    background: -webkit-linear-gradient(top, #B5CBDB 0%, #85A3BE 50%, #5E7DA1 100%);
    background: linear-gradient(to bottom, #B5CBDB 0%, #85A3BE 50%, #5E7DA1 100%);
}
</style>