#1B6A8C - #BDD4DE | 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 #1B6A8C to #BDD4DE

#1B6A8C #BDD4DE

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

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

0.0%	0.0% #1B6A8C	RGB 27 106 140	#1B6A8C
16.7%	16.7% #367B99	RGB 54 123 153	#367B99
33.3%	33.3% #518DA7	RGB 81 141 167	#518DA7
50.0%	50.0% #6C9FB5	RGB 108 159 181	#6C9FB5
66.7%	66.7% #87B0C2	RGB 135 176 194	#87B0C2
83.3%	83.3% #A2C2D0	RGB 162 194 208	#A2C2D0
100.0%	100.0% #BDD4DE	RGB 189 212 222	#BDD4DE

#1B6A8C #367B99 #518DA7 #6C9FB5 #87B0C2 #A2C2D0 #BDD4DE

#1B6A8C - #BDD4DE

HSV Blend

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

0.0%	0.0% #1B6A8C	RGB 27 106 140	#1B6A8C
16.7%	16.7% #2E7999	RGB 46 121 153	#2E7999
33.3%	33.3% #4589A7	RGB 69 137 167	#4589A7
50.0%	50.0% #5E9AB5	RGB 94 154 181	#5E9AB5
66.7%	66.7% #7BADC2	RGB 123 173 194	#7BADC2
83.3%	83.3% #9AC0D0	RGB 154 192 208	#9AC0D0
100.0%	100.0% #BDD4DE	RGB 189 212 222	#BDD4DE

#1B6A8C #2E7999 #4589A7 #5E9AB5 #7BADC2 #9AC0D0 #BDD4DE

#1B6A8C - #5E9AB5 - #BDD4DE

CSS codes

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

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