1

I need your help with a little something. I am trying to create an SVG logo with paths and I almost did it successfully but I am facing some issues.

My SVG logo path is:

<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 24"><title>raw improved</title><path d="M-3270.31-3353l3.16-18.74h5l-3.22,18.74Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/><path d="M-3227.46-3353l3.23-18.74h4.94l-1.78,10.43,7.9-5.46a3.56,3.56,0,0,1-.07,1.49,3.56,3.56,0,0,1-1.72,2.13l3.64,10.15h-5.29l-2.68-7.1-2.26,1.56-1,5.54Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/><path d="M-3270-3366.74l-12.57-.07a3.22,3.22,0,0,0-2.2.92,3.45,3.45,0,0,0-1,1.85l-.62,3.54a2.48,2.48,0,0,0,.48,2.06,2.31,2.31,0,0,0,1.65.85l7-.07a.69.69,0,0,1,.48.22.74.74,0,0,1,.2.49l-.2,1.28a1.44,1.44,0,0,1-.42.43,1.71,1.71,0,0,1-.27.14h-9.89a2,2,0,0,0,.41,1.42,1.84,1.84,0,0,0,1.65.64h9.75a3.61,3.61,0,0,0,2.2-.64,3.69,3.69,0,0,0,1.3-1.64l.76-4.18a2.35,2.35,0,0,0-.48-2.2,2.15,2.15,0,0,0-1.65-.71h-7.21a.56.56,0,0,1-.41-.22.58.58,0,0,1-.14-.42l.21-1a.75.75,0,0,1,.2-.5.68.68,0,0,1,.48-.21h7.63a2.4,2.4,0,0,0,2-.71A2.45,2.45,0,0,0-3270-3366.74Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/><path d="M-3300.45-3353l2.33-13.77h4.81l-.34,2.06a3.2,3.2,0,0,1,.82-1.28,3.05,3.05,0,0,1,1.51-.78h4.33a3.3,3.3,0,0,1-1,2,3.11,3.11,0,0,1-1.72.79H-3293a.94.94,0,0,0-.62.35,1,1,0,0,0-.2.64l-1.72,10Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/><path d="M-3337-3347.79l3.23-19h5l-.21,1.56a2.15,2.15,0,0,1,.62-1.07,2,2,0,0,1,1-.49h7.07a2.31,2.31,0,0,1,1.51.71,2.47,2.47,0,0,1,.69,1.77l-1.3,8.09a3.94,3.94,0,0,1-1.24,2.27,3.65,3.65,0,0,1-2.13.93h-6.73a1.79,1.79,0,0,1-.82-.5,1.85,1.85,0,0,1-.48-1.07l-1.17,6.82Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/><path d="M-3330.6-3356.17l1.31-7.59a.85.85,0,0,1,.27-.64.78.78,0,0,1,.48-.21h4.95a.6.6,0,0,1,.41.35.72.72,0,0,1,0,.5l-1.31,7.73a1.22,1.22,0,0,1-.2.43,1.29,1.29,0,0,1-.48.36h-4.95a.65.65,0,0,1-.48-.36A.71.71,0,0,1-3330.6-3356.17Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/><path d="M-3353.19-3356l1.85-10.78h5l-1.79,10.71a.79.79,0,0,0,0,.43.73.73,0,0,0,.41.43h4.81a.91.91,0,0,0,.41-.22.94.94,0,0,0,.28-.57l1.85-10.78h5l-2.74,15.75a4,4,0,0,1-1.31,2.34,3.75,3.75,0,0,1-2.33.93h-9.89a2,2,0,0,1-1.72-.64,2.17,2.17,0,0,1-.55-1.56h9.89a1.33,1.33,0,0,0,.55-.29,1.32,1.32,0,0,0,.41-.64l.62-3.62a3.46,3.46,0,0,1-.82,1,7,7,0,0,1-.83.5h-6.73a2.44,2.44,0,0,1-1.64-.71A2.61,2.61,0,0,1-3353.19-3356Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/><path d="M-3371.32-3353l3.23-18.74h4.94l-1,6.25a2,2,0,0,1,.48-.71,2,2,0,0,1,1.31-.57h6.59a2.3,2.3,0,0,1,1.72.85,2.48,2.48,0,0,1,.48,2.06l-1.79,10.86h-5l1.85-10.72a.68.68,0,0,0-.13-.71.57.57,0,0,0-.35-.14h-4.67a.9.9,0,0,0-.48.21,1,1,0,0,0-.34.64l-1.86,10.72Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/><path d="M-3305.12-3353a2.76,2.76,0,0,0,2.26-.79,2.79,2.79,0,0,0,.76-1.41h-10.23a.62.62,0,0,1-.35-.22.64.64,0,0,1-.13-.42l.34-2.2a.67.67,0,0,1,.14-.36.62.62,0,0,1,.27-.21h10.85l.89-5.47a2.45,2.45,0,0,0-.55-1.84,2.31,2.31,0,0,0-1.71-.85h-10.37a3.55,3.55,0,0,0-2.13.78,3.72,3.72,0,0,0-1.3,2.06l-1.31,7.73a2.64,2.64,0,0,0,.62,2.49,2.43,2.43,0,0,0,1.92.71Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/><path d="M-3312-3360.85l.55-2.84a1,1,0,0,1,.21-.57.93.93,0,0,1,.55-.35h4.87a.52.52,0,0,1,.34.14.66.66,0,0,1,.14.71l-.48,2.91Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/><path d="M-3257-3360.85l.42-2.7a1.22,1.22,0,0,1,.27-.71,1.17,1.17,0,0,1,.48-.35h5a.54.54,0,0,1,.34.14.68.68,0,0,1,.14.71l-.48,2.91Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/><path d="M-3250.32-3353a2.89,2.89,0,0,0,2.26-.71,3,3,0,0,0,.89-1.49h-10.23a.63.63,0,0,1-.34-.22.65.65,0,0,1-.14-.42l.35-2.13a.65.65,0,0,1,.13-.43.61.61,0,0,1,.35-.21h10.78l.89-5.54a2.48,2.48,0,0,0-.69-1.91,2.27,2.27,0,0,0-1.85-.71h-10a3.46,3.46,0,0,0-2.13.71,3.61,3.61,0,0,0-1.3,2l-1.37,7.88a2.59,2.59,0,0,0,.55,2.41,2.39,2.39,0,0,0,1.92.79Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/><path d="M-3232.4-3353a2.86,2.86,0,0,0,2.06-.64,3,3,0,0,0,1-1.56h-10.09a.76.76,0,0,1-.49-.29.71.71,0,0,1-.13-.35l.34-2.13a.87.87,0,0,1,.21-.43.79.79,0,0,1,.27-.21h10.78l.9-5.39a2.55,2.55,0,0,0-.62-2,2.38,2.38,0,0,0-1.72-.78h-10.37a3.52,3.52,0,0,0-2.13.85,3.73,3.73,0,0,0-1.16,1.84L-3245-3356a2.59,2.59,0,0,0,.55,2.13,2.42,2.42,0,0,0,2.06.86Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/><path d="M-3239.2-3360.85l.48-3.05a.87.87,0,0,1,.28-.5.78.78,0,0,1,.54-.21h4.74a.51.51,0,0,1,.42.14.54.54,0,0,1,.13.43l-.41,3.19Z" transform="translate(3371.32 3371.78)" fill="none" fill-rule="evenodd"/></svg>

Now, there are 3 main issues with it.

First and most annoying is, the letters "E" and "P" from my brand name hypersleek fills completely with color because both the outer path and inside path in letter "E" and "P" are served separately as paths.

See, the issue is:

enter image description here

As you can see, the "P" and "E" letters are being filled completely and I don't know how to fix that.

The second issue is when I try to use the SVG code for my website's logo, it comes in the center of the webpage probably due to transform="translate" thing in SVG. How do I fix these issues, I have become so pissed, help.

2

1 Answer 1

2

Select a letter and its counter (the part in the middle). Then open the Pathfinder panel, and hit the Minus Front button. Do this for each of the problematic letters.

This example shows the fix already applied to the letter p, and the selection for the letter e, before applying Minus Front

enter image description here

2
  • Or make them compound paths
    – joojaa
    Jul 29, 2022 at 18:07
  • @GunnuSingh Hmmm . . . I'm not too sure what the best settings would be, but you could try combining the whole lot, which would reduce the number of path elements and transforms to one, and then see if you can remove the last remaining transform. Combining may get rid of the transforms. Haven't tested this hypothesis though.
    – Billy Kerr
    Jul 30, 2022 at 9:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.