#1B5E72 - #BDD1D6 | 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 #1B5E72 to #BDD1D6

#1B5E72 #BDD1D6

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

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

0.0%	0.0% #1B5E72	RGB 27 94 114	#1B5E72
16.7%	16.7% #367182	RGB 54 113 130	#367182
33.3%	33.3% #518493	RGB 81 132 147	#518493
50.0%	50.0% #6C97A4	RGB 108 151 164	#6C97A4
66.7%	66.7% #87AAB4	RGB 135 170 180	#87AAB4
83.3%	83.3% #A2BDC5	RGB 162 189 197	#A2BDC5
100.0%	100.0% #BDD1D6	RGB 189 209 214	#BDD1D6

#1B5E72 #367182 #518493 #6C97A4 #87AAB4 #A2BDC5 #BDD1D6

#1B5E72 - #BDD1D6

HSV Blend

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

0.0%	0.0% #1B5E72	RGB 27 94 114	#1B5E72
16.7%	16.7% #2D6F82	RGB 45 111 130	#2D6F82
33.3%	33.3% #428193	RGB 66 129 147	#428193
50.0%	50.0% #5B94A4	RGB 91 148 164	#5B94A4
66.7%	66.7% #78A8B4	RGB 120 168 180	#78A8B4
83.3%	83.3% #99BCC5	RGB 153 188 197	#99BCC5
100.0%	100.0% #BDD1D6	RGB 189 209 214	#BDD1D6

#1B5E72 #2D6F82 #428193 #5B94A4 #78A8B4 #99BCC5 #BDD1D6

#1B5E72 - #5B94A4 - #BDD1D6

CSS codes

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

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