#56657C - #CED3D9 | 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 #56657C to #CED3D9

#56657C #CED3D9

Calculate the color between two colors, #56657C and #CED3D9. 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)

#56657C - #CED3D9 | 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 #56657C as 0% and #CED3D9 as 100%.

0.0%	0.0% #56657C	RGB 86 101 124	#56657C
16.7%	16.7% #6A778B	RGB 106 119 139	#6A778B
33.3%	33.3% #7E899B	RGB 126 137 155	#7E899B
50.0%	50.0% #929CAA	RGB 146 156 170	#929CAA
66.7%	66.7% #A6AEBA	RGB 166 174 186	#A6AEBA
83.3%	83.3% #BAC0C9	RGB 186 192 201	#BAC0C9
100.0%	100.0% #CED3D9	RGB 206 211 217	#CED3D9

#56657C #6A778B #7E899B #929CAA #A6AEBA #BAC0C9 #CED3D9

#56657C - #CED3D9

HSV Blend

#56657C - #CED3D9 | 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 #56657C as 0% and #CED3D9 as 100%.

0.0%	0.0% #56657C	RGB 86 101 124	#56657C
16.7%	16.7% #66758B	RGB 102 117 139	#66758B
33.3%	33.3% #78869B	RGB 120 134 155	#78869B
50.0%	50.0% #8C98AA	RGB 140 152 170	#8C98AA
66.7%	66.7% #A0ABBA	RGB 160 171 186	#A0ABBA
83.3%	83.3% #B6BFC9	RGB 182 191 201	#B6BFC9
100.0%	100.0% #CED3D9	RGB 206 211 217	#CED3D9

#56657C #66758B #78869B #8C98AA #A0ABBA #B6BFC9 #CED3D9

#56657C - #8C98AA - #CED3D9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #56657C 0%, #8C98AA 50%, #CED3D9 100%);
    background: -webkit-linear-gradient(top, #56657C 0%, #8C98AA 50%, #CED3D9 100%);
    background: linear-gradient(to bottom, #56657C 0%, #8C98AA 50%, #CED3D9 100%);
}
</style>