#3C5167 - #C7CDD3 | 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 #3C5167 to #C7CDD3

#3C5167 #C7CDD3

Calculate the color between two colors, #3C5167 and #C7CDD3. 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)

#3C5167 - #C7CDD3 | 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 #3C5167 as 0% and #C7CDD3 as 100%.

0.0%	0.0% #3C5167	RGB 60 81 103	#3C5167
16.7%	16.7% #536579	RGB 83 101 121	#536579
33.3%	33.3% #6A7A8B	RGB 106 122 139	#6A7A8B
50.0%	50.0% #818F9D	RGB 129 143 157	#818F9D
66.7%	66.7% #98A3AF	RGB 152 163 175	#98A3AF
83.3%	83.3% #AFB8C1	RGB 175 184 193	#AFB8C1
100.0%	100.0% #C7CDD3	RGB 199 205 211	#C7CDD3

#3C5167 #536579 #6A7A8B #818F9D #98A3AF #AFB8C1 #C7CDD3

#3C5167 - #C7CDD3

HSV Blend

#3C5167 - #C7CDD3 | 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 #3C5167 as 0% and #C7CDD3 as 100%.

0.0%	0.0% #3C5067	RGB 60 80 103	#3C5067
16.7%	16.7% #4D6279	RGB 77 98 121	#4D6279
33.3%	33.3% #61768B	RGB 97 118 139	#61768B
50.0%	50.0% #778A9D	RGB 119 138 157	#778A9D
66.7%	66.7% #909FAF	RGB 144 159 175	#909FAF
83.3%	83.3% #AAB5C1	RGB 170 181 193	#AAB5C1
100.0%	100.0% #C7CDD3	RGB 199 205 211	#C7CDD3

#3C5067 #4D6279 #61768B #778A9D #909FAF #AAB5C1 #C7CDD3

#3C5167 - #778A9D - #C7CDD3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C5067 0%, #778A9D 50%, #C7CDD3 100%);
    background: -webkit-linear-gradient(top, #3C5067 0%, #778A9D 50%, #C7CDD3 100%);
    background: linear-gradient(to bottom, #3C5067 0%, #778A9D 50%, #C7CDD3 100%);
}
</style>