If you found this Gist, then keep in mind that it is not complete unting this message gets removed. There are missing steps.
- Remove fill
- Set the viewport
- Export clean SVG
- Optimizations?
Import your original SVG file from File -> Import menu:
Select entire icon an find out its bounding box size
As we see, it's in millimeters if you just installed Inkscape. Change it to pixels:
As we can see, it's a perfect square in this case.
Q: What if it is not a square?
Lock the proportions so that width and height always changes proportionally:
Change the icon size down to 24px and zoom in:
Make sure selection tool is selected:
Double click to select single element/path:
In the Layers and Objects pane on the right side you can see what is selected:
Select from the main menu Object -> Fill and Stroke.... New tab in the right side will appear.
Set Stroke paint to flat/solid type
Set the Stroke style -> Width to 0.25pt
Do it for all elements. You can do the same by selecting all paths at once. Be sure to first change the measurement to pt and only then to change the value to 0.25.
Keep the all paths/objects selected. Or select them all again.
Go to Path menu and select Stroke to Path. You should end up with double of paths/objects:
Now select the first group, then right click and select Ungroup.
Don't do it the same for the all groups yet now. Keep working now with this single element.
Keep the selection of booth paths.
Stroke should be above and the figure should be below the stroke. The order of the objects is important to keep so that Inkscape knows what should be subtracted from what.
Got to Path and select Difference
You should end up with the stroke path being deleted and the cutout being made for the element.
Now you can do the same steps for the every single other element.
Select element group -> Ungroup -> Path -> Difference.
You should end up with the all cutouts
Select all objects/paths, go to Path and select Combine.
You should end up with one single combined path.
But it's size now will not be exact 24px because we subtracted those cutouts.
Look at the largest value and increase its size to 24px. Don't change the other value as this will ruin the original proportions of the icon. Keep that lock icon closed.