Question converting the properties of this svg using inkscape

Question

I am working with this svg file of the medium monogram logo. Here is the svg code if it helps:

<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg
 width="195px" height="195px" viewBox="0 0 195 195" version="1.1"
 xmlns="http://www.w3.org/2000/svg"
 xmlns:xlink="http://www.w3.org/1999/xlink">
     <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
     <title>Monogram</title>
     <desc>Created with Sketch.</desc>
     <defs></defs>
     <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
         <g id="Monogram" fill-rule="nonzero">
             <rect id="Rectangle-path" fill="#12100E" x="0" y="0" width="195" height="195"></rect>
             <path d="M46.5340803,65.2157554 C46.6968378,63.6076572 46.0836,62.018231 44.8828198,60.93592 L32.6512605,46.2010582 L32.6512605,44 L70.6302521,44 L99.9859944,108.380952 L125.794585,44
 L162,44 L162,46.2010582 L151.542017,56.2281011 C150.640424,56.9153477
 150.193188,58.0448862 150.380019,59.1628454 L150.380019,132.837155 C150.193188,133.955114 150.640424,135.084652 151.542017,135.771899
 L161.755369,145.798942 L161.755369,148 L110.38282,148
 L110.38282,145.798942 L120.963119,135.527337 C122.002801,134.487948
 122.002801,134.182246 122.002801,132.592593 L122.002801,73.0417402 L92.585901,147.755438 L88.6106443,147.755438 L54.3622782,73.0417402
 L54.3622782,123.115814 C54.0767278,125.221069 54.7759199,127.3406
 56.2581699,128.863022 L70.0186741,145.55438 L70.0186741,147.755438 L31,147.755438 L31,145.55438 L44.7605042,128.863022
 C46.2319621,127.338076 46.8903838,125.204485 46.5340803,123.115814
 L46.5340803,65.2157554 Z" id="Shape" fill="#FFFFFF"></path>
         </g>
     </g> </svg>

My problem is that it appears that the way this svg is implemented is that it is a white path object in the shape of a "M" over a black rectangle. My desired goal is to have a black path object with a hole where the white "M" would be. So that css classes could be applied to the black rectangle instead of the white "M". How would I do this in inkscape?

Answer 1

1. In Inkscape ungroup the graphic

2. Select both the M and black square

3. Click Path > Difference

Now the M is cut out from the black, leaving a hole. You can check this by going into the Document Properties and enable the Checkerboard Background which will display the transparency grid.