#3F676B - #C8D2D4 | 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 #3F676B to #C8D2D4

#3F676B #C8D2D4

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

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

0.0%	0.0% #3F676B	RGB 63 103 107	#3F676B
16.7%	16.7% #55787C	RGB 85 120 124	#55787C
33.3%	33.3% #6C8A8E	RGB 108 138 142	#6C8A8E
50.0%	50.0% #839C9F	RGB 131 156 159	#839C9F
66.7%	66.7% #9AAEB1	RGB 154 174 177	#9AAEB1
83.3%	83.3% #B1C0C2	RGB 177 192 194	#B1C0C2
100.0%	100.0% #C8D2D4	RGB 200 210 212	#C8D2D4

#3F676B #55787C #6C8A8E #839C9F #9AAEB1 #B1C0C2 #C8D2D4

#3F676B - #C8D2D4

HSV Blend

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

0.0%	0.0% #3F676B	RGB 63 103 107	#3F676B
16.7%	16.7% #50777C	RGB 80 119 124	#50777C
33.3%	33.3% #64898E	RGB 100 137 142	#64898E
50.0%	50.0% #7A9A9F	RGB 122 154 159	#7A9A9F
66.7%	66.7% #92ACB1	RGB 146 172 177	#92ACB1
83.3%	83.3% #ABBFC2	RGB 171 191 194	#ABBFC2
100.0%	100.0% #C8D2D4	RGB 200 210 212	#C8D2D4

#3F676B #50777C #64898E #7A9A9F #92ACB1 #ABBFC2 #C8D2D4

#3F676B - #7A9A9F - #C8D2D4

CSS codes

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

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