#5B8EB6 - #C2CBCA | 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 #5B8EB6 to #C2CBCA

#5B8EB6 #C2CBCA

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

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

0.0%	0.0% #5B8EB6	RGB 91 142 182	#5B8EB6
16.7%	16.7% #6C98B9	RGB 108 152 185	#6C98B9
33.3%	33.3% #7DA2BC	RGB 125 162 188	#7DA2BC
50.0%	50.0% #8EACC0	RGB 142 172 192	#8EACC0
66.7%	66.7% #9FB6C3	RGB 159 182 195	#9FB6C3
83.3%	83.3% #B0C0C6	RGB 176 192 198	#B0C0C6
100.0%	100.0% #C2CBCA	RGB 194 203 202	#C2CBCA

#5B8EB6 #6C98B9 #7DA2BC #8EACC0 #9FB6C3 #B0C0C6 #C2CBCA

#5B8EB6 - #C2CBCA

HSV Blend

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

0.0%	0.0% #5B8EB6	RGB 91 142 182	#5B8EB6
16.7%	16.7% #6A9EB9	RGB 106 158 185	#6A9EB9
33.3%	33.3% #7BACBD	RGB 123 172 189	#7BACBD
50.0%	50.0% #8CB7C0	RGB 140 183 192	#8CB7C0
66.7%	66.7% #9DC1C4	RGB 157 193 196	#9DC1C4
83.3%	83.3% #AFC7C7	RGB 175 199 199	#AFC7C7
100.0%	100.0% #C2CBCA	RGB 194 203 202	#C2CBCA

#5B8EB6 #6A9EB9 #7BACBD #8CB7C0 #9DC1C4 #AFC7C7 #C2CBCA

#5B8EB6 - #8CB7C0 - #C2CBCA

CSS codes

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

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