#3A5E4D - #C6D1CC | 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 #3A5E4D to #C6D1CC

#3A5E4D #C6D1CC

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

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

0.0%	0.0% #3A5E4D	RGB 58 94 77	#3A5E4D
16.7%	16.7% #517162	RGB 81 113 98	#517162
33.3%	33.3% #688477	RGB 104 132 119	#688477
50.0%	50.0% #80978C	RGB 128 151 140	#80978C
66.7%	66.7% #97AAA1	RGB 151 170 161	#97AAA1
83.3%	83.3% #AEBDB6	RGB 174 189 182	#AEBDB6
100.0%	100.0% #C6D1CC	RGB 198 209 204	#C6D1CC

#3A5E4D #517162 #688477 #80978C #97AAA1 #AEBDB6 #C6D1CC

#3A5E4D - #C6D1CC

HSV Blend

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

0.0%	0.0% #3A5E4D	RGB 58 94 77	#3A5E4D
16.7%	16.7% #4C715F	RGB 76 113 95	#4C715F
33.3%	33.3% #608473	RGB 96 132 115	#608473
50.0%	50.0% #769788	RGB 118 151 136	#769788
66.7%	66.7% #8EAA9D	RGB 142 170 157	#8EAA9D
83.3%	83.3% #A9BDB4	RGB 169 189 180	#A9BDB4
100.0%	100.0% #C6D1CC	RGB 198 209 204	#C6D1CC

#3A5E4D #4C715F #608473 #769788 #8EAA9D #A9BDB4 #C6D1CC

#3A5E4D - #769788 - #C6D1CC

CSS codes

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

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