#1B566C - #BDCED5 | 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 #1B566C to #BDCED5

#1B566C #BDCED5

Calculate the color between two colors, #1B566C and #BDCED5. 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)

#1B566C - #BDCED5 | 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 #1B566C as 0% and #BDCED5 as 100%.

0.0%	0.0% #1B566C	RGB 27 86 108	#1B566C
16.7%	16.7% #366A7D	RGB 54 106 125	#366A7D
33.3%	33.3% #517E8F	RGB 81 126 143	#517E8F
50.0%	50.0% #6C92A0	RGB 108 146 160	#6C92A0
66.7%	66.7% #87A6B2	RGB 135 166 178	#87A6B2
83.3%	83.3% #A2BAC3	RGB 162 186 195	#A2BAC3
100.0%	100.0% #BDCED5	RGB 189 206 213	#BDCED5

#1B566C #366A7D #517E8F #6C92A0 #87A6B2 #A2BAC3 #BDCED5

#1B566C - #BDCED5

HSV Blend

#1B566C - #BDCED5 | 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 #1B566C as 0% and #BDCED5 as 100%.

0.0%	0.0% #1B556C	RGB 27 85 108	#1B556C
16.7%	16.7% #2C677D	RGB 44 103 125	#2C677D
33.3%	33.3% #42798F	RGB 66 121 143	#42798F
50.0%	50.0% #5B8DA0	RGB 91 141 160	#5B8DA0
66.7%	66.7% #78A1B2	RGB 120 161 178	#78A1B2
83.3%	83.3% #98B7C3	RGB 152 183 195	#98B7C3
100.0%	100.0% #BDCED5	RGB 189 206 213	#BDCED5

#1B556C #2C677D #42798F #5B8DA0 #78A1B2 #98B7C3 #BDCED5

#1B566C - #5B8DA0 - #BDCED5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #1B556C 0%, #5B8DA0 50%, #BDCED5 100%);
    background: -webkit-linear-gradient(top, #1B556C 0%, #5B8DA0 50%, #BDCED5 100%);
    background: linear-gradient(to bottom, #1B556C 0%, #5B8DA0 50%, #BDCED5 100%);
}
</style>