The SVG files are the standard to use vector images in your Web app, applications and website projects. Their biggest advantage: you can rescale them while keeping a perfect quality, and they are easy to colorize with CSS.
Changing icon color
Change the color through the CSS declaration, by setting a a color for the .currentColor value used in the .svg files.
Change stroke width
SVGs have a “stroke-width” attribute that can be set on the .svg tag directly or with CSS.
Read this article for more details about the benefits of using SVG stroke.
Check also SVG for absolute beginners by Rob Levin
Scale strokes when changing icon size
Set the .vector-effect property of the SVG’s children to .non-scaling-stroke. This allows you to scale the icon without affecting the stroke width.Resizing a SVG circle with a “non-scaling-stroke” value
Thanks to Cole Bemis for these tips 🙏🏻