Change SVG color on hover using custom code only

Design help Custom code
6

Thank you @imtiazraqib , and @mikeyevin that is a super helpful idea.

I’m s t i l l struggling, if you wouldn’t mind taking a quick look at this code to see if I have this correct I would appreciate it very much, because it seems like it should be working…

I tried it with a simpler SVG, in an HTML embed:

<svg class="x-svg" width="70px" height="70px" viewBox="0 0 70 70" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <g id="Logo-&amp;-graphics" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="Web-Icons" transform="translate(-1062.000000, -901.000000)" fill-rule="nonzero" stroke="#000000" stroke-width="8">
            <g id="Group-2" transform="translate(1096.500000, 936.500000) rotate(45.000000) translate(-1096.500000, -936.500000) translate(1052.000000, 892.000000)">
                <path d="M45,0 L45,88.8024135" id="Path-12"></path>
                <path d="M88.8024135,44 L0,44" id="Path-12-Copy"></path>
            </g>
        </g>
    </g>
</svg>

and then in another HTML embed, I have:

<style>
.x-svg:hover {
          fill: red;
      }
</style>

and its not showing up in preview or in published version…