How to properly organize paths and fills in svg icons in preparation for layout?

Question

Layout

Good day to all!
Making a pixel perfect icon for a web application. They consist of paths and fills. These are menu icons. It is assumed that these icons will have two states - active and inactive. Only the color of the paths will change.
The next question is generally possible not to translate paths into fills? If yes, then for a successful color change, is it worth grouping them in a file?

Answer 1

The next question is generally possible not to translate paths into fills? If yes, then for a successful color change, is it worth grouping them in a file?

The question is incorrect - it seems you are confusing path and stroke, or I did not understand the question.
If you still understand, it is better to translate and create a compound path, even better - one path, one icon.
Then once hover - fill what you need and that's it.