#5E81AC - #BDC1C3 | 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 #5E81AC to #BDC1C3

#5E81AC #BDC1C3

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

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

0.0%	0.0% #5E81AC	RGB 94 129 172	#5E81AC
16.7%	16.7% #6D8BAF	RGB 109 139 175	#6D8BAF
33.3%	33.3% #7D96B3	RGB 125 150 179	#7D96B3
50.0%	50.0% #8DA1B7	RGB 141 161 183	#8DA1B7
66.7%	66.7% #9DABBB	RGB 157 171 187	#9DABBB
83.3%	83.3% #ADB6BF	RGB 173 182 191	#ADB6BF
100.0%	100.0% #BDC1C3	RGB 189 193 195	#BDC1C3

#5E81AC #6D8BAF #7D96B3 #8DA1B7 #9DABBB #ADB6BF #BDC1C3

#5E81AC - #BDC1C3

HSV Blend

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

0.0%	0.0% #5E81AC	RGB 94 129 172	#5E81AC
16.7%	16.7% #6C8DAF	RGB 108 141 175	#6C8DAF
33.3%	33.3% #7B98B3	RGB 123 152 179	#7B98B3
50.0%	50.0% #8BA3B7	RGB 139 163 183	#8BA3B7
66.7%	66.7% #9BAEBB	RGB 155 174 187	#9BAEBB
83.3%	83.3% #ABB8BF	RGB 171 184 191	#ABB8BF
100.0%	100.0% #BDC1C3	RGB 189 193 195	#BDC1C3

#5E81AC #6C8DAF #7B98B3 #8BA3B7 #9BAEBB #ABB8BF #BDC1C3

#5E81AC - #8BA3B7 - #BDC1C3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E81AC 0%, #8BA3B7 50%, #BDC1C3 100%);
    background: -webkit-linear-gradient(top, #5E81AC 0%, #8BA3B7 50%, #BDC1C3 100%);
    background: linear-gradient(to bottom, #5E81AC 0%, #8BA3B7 50%, #BDC1C3 100%);
}
</style>