#3E718B - #AFBAB3 | 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 #3E718B to #AFBAB3

#3E718B #AFBAB3

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

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

0.0%	0.0% #3E718B	RGB 62 113 139	#3E718B
16.7%	16.7% #507D91	RGB 80 125 145	#507D91
33.3%	33.3% #638998	RGB 99 137 152	#638998
50.0%	50.0% #76959F	RGB 118 149 159	#76959F
66.7%	66.7% #89A1A5	RGB 137 161 165	#89A1A5
83.3%	83.3% #9CADAC	RGB 156 173 172	#9CADAC
100.0%	100.0% #AFBAB3	RGB 175 186 179	#AFBAB3

#3E718B #507D91 #638998 #76959F #89A1A5 #9CADAC #AFBAB3

#3E718B - #AFBAB3

HSV Blend

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

0.0%	0.0% #3E718B	RGB 62 113 139	#3E718B
16.7%	16.7% #4D8692	RGB 77 134 146	#4D8692
33.3%	33.3% #5E999A	RGB 94 153 154	#5E999A
50.0%	50.0% #70A29B	RGB 112 162 155	#70A29B
66.7%	66.7% #84AA9E	RGB 132 170 158	#84AA9E
83.3%	83.3% #98B2A6	RGB 152 178 166	#98B2A6
100.0%	100.0% #AFBAB3	RGB 175 186 179	#AFBAB3

#3E718B #4D8692 #5E999A #70A29B #84AA9E #98B2A6 #AFBAB3

#3E718B - #70A29B - #AFBAB3

CSS codes

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

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