#1B5A72 - #BDCFD6 | 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 #1B5A72 to #BDCFD6

#1B5A72 #BDCFD6

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

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

0.0%	0.0% #1B5A72	RGB 27 90 114	#1B5A72
16.7%	16.7% #366D82	RGB 54 109 130	#366D82
33.3%	33.3% #518193	RGB 81 129 147	#518193
50.0%	50.0% #6C94A4	RGB 108 148 164	#6C94A4
66.7%	66.7% #87A8B4	RGB 135 168 180	#87A8B4
83.3%	83.3% #A2BBC5	RGB 162 187 197	#A2BBC5
100.0%	100.0% #BDCFD6	RGB 189 207 214	#BDCFD6

#1B5A72 #366D82 #518193 #6C94A4 #87A8B4 #A2BBC5 #BDCFD6

#1B5A72 - #BDCFD6

HSV Blend

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

0.0%	0.0% #1B5A72	RGB 27 90 114	#1B5A72
16.7%	16.7% #2D6A82	RGB 45 106 130	#2D6A82
33.3%	33.3% #427C93	RGB 66 124 147	#427C93
50.0%	50.0% #5B8FA4	RGB 91 143 164	#5B8FA4
66.7%	66.7% #78A3B4	RGB 120 163 180	#78A3B4
83.3%	83.3% #99B8C5	RGB 153 184 197	#99B8C5
100.0%	100.0% #BDCFD6	RGB 189 207 214	#BDCFD6

#1B5A72 #2D6A82 #427C93 #5B8FA4 #78A3B4 #99B8C5 #BDCFD6

#1B5A72 - #5B8FA4 - #BDCFD6

CSS codes

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

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