#5E8CD2 - #B2CADD | 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 #5E8CD2 to #B2CADD

#5E8CD2 #B2CADD

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

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

0.0%	0.0% #5E8CD2	RGB 94 140 210	#5E8CD2
16.7%	16.7% #6C96D3	RGB 108 150 211	#6C96D3
33.3%	33.3% #7AA0D5	RGB 122 160 213	#7AA0D5
50.0%	50.0% #88ABD7	RGB 136 171 215	#88ABD7
66.7%	66.7% #96B5D9	RGB 150 181 217	#96B5D9
83.3%	83.3% #A4BFDB	RGB 164 191 219	#A4BFDB
100.0%	100.0% #B2CADD	RGB 178 202 221	#B2CADD

#5E8CD2 #6C96D3 #7AA0D5 #88ABD7 #96B5D9 #A4BFDB #B2CADD

#5E8CD2 - #B2CADD

HSV Blend

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

0.0%	0.0% #5E8BD2	RGB 94 139 210	#5E8BD2
16.7%	16.7% #6B97D3	RGB 107 151 211	#6B97D3
33.3%	33.3% #79A2D5	RGB 121 162 213	#79A2D5
50.0%	50.0% #87ADD7	RGB 135 173 215	#87ADD7
66.7%	66.7% #95B7D9	RGB 149 183 217	#95B7D9
83.3%	83.3% #A3C1DB	RGB 163 193 219	#A3C1DB
100.0%	100.0% #B2CADD	RGB 178 202 221	#B2CADD

#5E8BD2 #6B97D3 #79A2D5 #87ADD7 #95B7D9 #A3C1DB #B2CADD

#5E8CD2 - #87ADD7 - #B2CADD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E8BD2 0%, #87ADD7 50%, #B2CADD 100%);
    background: -webkit-linear-gradient(top, #5E8BD2 0%, #87ADD7 50%, #B2CADD 100%);
    background: linear-gradient(to bottom, #5E8BD2 0%, #87ADD7 50%, #B2CADD 100%);
}
</style>