#3F554C - #C8CECB | 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 #3F554C to #C8CECB

#3F554C #C8CECB

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

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

0.0%	0.0% #3F554C	RGB 63 85 76	#3F554C
16.7%	16.7% #556961	RGB 85 105 97	#556961
33.3%	33.3% #6C7D76	RGB 108 125 118	#6C7D76
50.0%	50.0% #83918B	RGB 131 145 139	#83918B
66.7%	66.7% #9AA5A0	RGB 154 165 160	#9AA5A0
83.3%	83.3% #B1B9B5	RGB 177 185 181	#B1B9B5
100.0%	100.0% #C8CECB	RGB 200 206 203	#C8CECB

#3F554C #556961 #6C7D76 #83918B #9AA5A0 #B1B9B5 #C8CECB

#3F554C - #C8CECB

HSV Blend

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

0.0%	0.0% #3F554C	RGB 63 85 76	#3F554C
16.7%	16.7% #51695F	RGB 81 105 95	#51695F
33.3%	33.3% #667D73	RGB 102 125 115	#667D73
50.0%	50.0% #7C9187	RGB 124 145 135	#7C9187
66.7%	66.7% #94A59D	RGB 148 165 157	#94A59D
83.3%	83.3% #ADB9B3	RGB 173 185 179	#ADB9B3
100.0%	100.0% #C8CECB	RGB 200 206 203	#C8CECB

#3F554C #51695F #667D73 #7C9187 #94A59D #ADB9B3 #C8CECB

#3F554C - #7C9187 - #C8CECB

CSS codes

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

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