Want to make font-awesome icons thinner
Sorry, it´s not possible to do that using standards (if it is not important in your project you can use the Kiryl Ply suggestion). Font-Awesome comes with just one font-weight variant. There is a new project to solve that problem (not ready yet):
https://www.kickstarter.com/projects/232193852/font-awesome-black-tie
you could look for another library with a bit thinner aspect, try "icon font" in Google.
try with this
.class-name i{
-webkit-text-stroke: 2px white;
}
.yourclass::before{
content: "\f07a";
font-family: 'Font Awesome 5 Free';
margin-right: 10px;
-webkit-text-stroke: 0.5px white;
color: transparent;
}
this did the work for me, change the color to transparent and add a text stroke of your favorite color and you can also change the text stroke to 1px or more if you want.
You can fix it in webkit with:
-webkit-text-stroke: 1px background-color;